topic Re: How to add image to splunk single value panel? in Splunk Enterprise

How to add image to splunk single value panel?

karthi25 — Mon, 11 Mar 2019 12:54:47 GMT

Am working on Splunk xml, I need to add image to a single value panel. The image needs to change based on the results. I know that we can use html tag inside the panel , but I want to have image in a single value panel because I need to drilldown to other panel when I click on that image.

When I tried by setting background image , the result of the single value panel query is getting overrided with image as below

Can anyone please help me with some solutions.

Re: How to add image to splunk single value panel?

vnravikumar — Mon, 11 Mar 2019 13:33:45 GMT

Hi @karthi25

Try the following code, it will set a background image based on the result. If it's not satisfied your requirement please give more information.

<dashboard>
  <label>testsingle</label>
  <row>
    <panel>
      <html>
        <style>
          #test{
             background-image:$path$  !important;
          }
        </style>
      </html>
      <single id="test">
        <search>
          <query>index="_internal" |stats count</query>
          <earliest>-24h@h</earliest>
          <latest>now</latest>
          <done>
            <condition match="'result.count' <200">
              <set token="path">url("/static/app/search/appLogo.png")</set>
            </condition>
            <condition match="'result.count' >=201">
              <set token="path">url("/static/app/search/appIcon.png")</set>
            </condition>
          </done>
        </search>
        <option name="drilldown">all</option>
        <drilldown>
          <link target="_blank">http://google.com</link>
        </drilldown>
      </single>
    </panel>
  </row>
</dashboard>

Re: How to add image to splunk single value panel?

nickhills — Mon, 11 Mar 2019 14:00:24 GMT

If you want to use an Icon (and want to change that Icon based on the results) have you looked at:
https://splunkbase.splunk.com/app/3119/

You can use any of the 5000 icons from Font Awesome:
https://fontawesome.com/icons?from=io

Re: How to add image to splunk single value panel?

niketn — Mon, 11 Mar 2019 14:24:06 GMT

@karthi25 are you interested in images or icons to be displayed? Is drilldown the only reason for you to have single value panel? Can you have jQuery based drilldown (if so Status Indicator and html panel both would work)?

Here is an example from one of older answers of mine on similar approach: https://answers.splunk.com/answers/590581/refresh-data-in-table-by-collecting-token-on-click.html

Re: How to add image to splunk single value panel?

karthi25 — Tue, 12 Mar 2019 10:08:18 GMT

@vnravikumar I don't have permission to add any images directly to splunk "/static/app/search" directory. Is there any way to upload the image from splunk UI.

Re: How to add image to splunk single value panel?

vnravikumar — Tue, 12 Mar 2019 10:22:21 GMT

Hi @karthi25

Try by going to Manage Apps then click on Edit properties in your respective app. In Upload asset choose the required image and click save

Re: How to add image to splunk single value panel?

karthi25 — Tue, 12 Mar 2019 12:11:28 GMT

@vnravikumar It works, but the image is not properly setting its bigger in size, also the values in the single panel is also showing , i want only the image based on the value.

Re: How to add image to splunk single value panel?

vnravikumar — Tue, 12 Mar 2019 12:13:14 GMT

Can you please upload the image

Re: How to add image to splunk single value panel?

karthi25 — Tue, 12 Mar 2019 12:24:35 GMT

Yes. I have updated my question.

Re: How to add image to splunk single value panel?

karthi25 — Tue, 12 Mar 2019 13:11:13 GMT

I have added opacity and z-index it was working fine. Thanks