How to make local image accessible to dashboard?

[yshen]

I use the following to define an icon, to display on my dashboard:
eval coldImg = "/weatherAssets/apps/ics_analysis/lowTemp.png"
in the Simple XML for the dashboard.

Here is the path for the image:
/opt/splunk/etc/apps/ics_analysis/weatherAssets/lowTemp.pngwhere

 ics_analysis is the name of the app and weatherAssets is the folder for the icons.

It used to display, when I had the following:
eval coldImg = "https://image.flaticon.com/icons/png/512/1312/1312331.png"

but now it only shows a broken image icon.

What could be wrong? How can I debug the problem?
It's frustrating that I don't know how to find out the error message to the issue.

Do I have to restart the Splunk server, or bump my dashboard?
(I just did reload the web page.)

Thanks for your help! 

[gcusello]

Hi @yshen,

usually images are stored in the appserver/static folder, so you could put your images in

/opt/splunk/etc/apps/ics_analysis/appserver/static/lowTemp.png

so, when you call the image in your dashboard, you can use the address:

<img src="/static/app/ics_analysis/lowTemp.png" style="width:800px;border:0;"/>

Ciao.

Giuseppe

[yshen]

@gcusello thanks for helping!

As I don't have the write access to the Splunk server, I had to ask the admin to place the folder weatherAssets for me. Now, it has been placed at 

/opt/splunk/etc/apps/ics_analysis/weatherAssets/lowTemp.png

I wonder if there is a way to use the above path somehow still make the image accessible to the dashboard?

Or do I have to place the image at 

/opt/splunk/etc/apps/ics_analysis/appserver/static/lowTemp.png

to make it work?

Where is the documentation for the rule of placing image?

Thanks again!

[gcusello]

Hi @yshen,

using the absolute path, it should run! event if I usually prefer to use the correct relative path.

Anyway, if it doesn't run, say to your administrator to check ownership and grants on the images.

You can find more information at 

https://docs.splunk.com/Documentation/Splunk/latest/Viz/PanelreferenceforSimplifiedXML#html

https://community.splunk.com/t5/Dashboards-Visualizations/Do-we-upload-image-on-indexer-under-specif...

https://docs.splunk.com/Documentation/StyleGuide/current/StyleGuide/screenshots

Ciao.

Giuseppe

[yshen]

@gcusello Thank for your further help!

From the information that you shared me, it seems that the image MUST be at 

/opt/splunk/etc/apps/ics_analysis/appserver/static/lowTemp.png

?

I wonder if it will work as follows:

/opt/splunk/etc/apps/ics_analysis/appserver/static/weatherAssets/lowTemp.png

as the application is large. I hope to have better separation within.

But even more unfortunate, the administrator is not responsive to help me at the moment.

Therefore, I'm very interested in your mentioned "absolute path". I wish that it would refer and access to my image at its current, non-standard location. But I could not find any information of how to express the absolute path in the Simple XML. 

Could you elaborate it?

Thanks again!

[gcusello]

Hi @yshen,

sorry, no absolute path doesn't run because the path is always calculated from the home app folder, so you could try something like this:

/static/app/ics_analysis/../../weatherAssets/lowTemp.png

but I'm not sure that it runs.

There another option:

if you ave an admin role, you could add objects to your App and Splunk automatically pus these objects in the appserver/static folder, you can do this in this way:

• open the Apps dropdown,
• click on Manage Apps,
• click on AppEdit properties,
• in the bottom of the form there's a button "Find File"
• Save.

You have to do this one file at a time.

Ciao.

Giuseppe

[yshen · Accepted solution]

@gcusello Clever idea!

I tried your suggestion. 

Here is the outcome:

I use 

https://splunk.bart.gov/en-US/static/app/ics_analysis/../../weatherAssets/lowTemp.png

it is translated by the browser (Chrome) or Splunk server as:

https://splunk.bart.gov/en-US/static/weatherAssets/lowTemp.png 

again failed.

I tried:

https://splunk.bart.gov/en-US/static/app/ics_analysis/../weatherAssets/lowTemp.png

it is converted as 

https://splunk.bart.gov/en-US/static/app/weatherAssets/lowTemp.png

It looks that the browser performed the translation of the /.. literally before reaching the web server.

Yes, I may try to manually upload the asset individually as last resort. 

Indeed, the manual approach works! Here is the proof:

At 

https://splunk.bart.gov/en-US/static/app/ics_analysis/lowTemp.png

The indented image is shown. Furthermore, the following also works in the dashboard:

| eval coldImg = "/static/app/ics_analysis/lowTemp.png"

Disappointed with Splunk's implementation, I guess, this is the best I can do.

(Why the disappointment, we're working with a big app, there are 3 to 5 engineers improving it, if I have to manually add about a dozen icons to apps/ics_analysis/appserver/static, suffering from the unnecessary repetition. That directory will be a big soup of mess, that no one can understand the files left there completely.)

Thanks again!

[gcusello]

Hi @yshen,

good for you, see next time!

Ciao and happy splunking.

Giuseppe

P.S.: Karma Points are appreciated 😉