Re: image display in Splunk cloud

splunkclouduser · ‎02-06-2020

I need to display an image to be in the centre of two panels in a dashboard in Splunk Cloud.
unlike splunk enterprise this is proving to be impossible even with hosting it on google.

Anyway to upload the image or call a http page

efavreau · ‎07-08-2020

Hi @splunkclouduser!

I understand this answer comes a bit later than when you asked, but I do have an answer! You can embed a base64 encoded image file in your dashboard using this code. I know this solution is less than perfect. (I've already submitted to Splunk Ideas an idea for static file management to make it easier on admins and users.) However, for the sake of the community, what you are looking to do can be done. 😍

Here is a run-anywhere XML dashboard that has 3 panels, and a base64 image in the center panel.

###

If this reply helps you, an upvote would be appreciated.

###

<dashboard>
  <label>Using a Base64 image in a dashboard - no upload or admin needed</label>
  <row>
    <panel>
      <title>Panel 1</title>
      <html>
      </html>
    </panel>
    <panel>
      <title>Panel 2 - Image</title>
      <html>
        <div class="fulcrum"/>
        <span role="img" aria-label="fulcrum"/>
        <!-- this span is as close as we can get to alt text for accessability -->
      </html>
    </panel>
    <panel>
      <title>Panel 3</title>
      <html>
      </html>
    </panel>
  </row>
  <row depends="$alwaysHideCSS$">
    <panel>
      <html>
        <!-- Base64 conversion tool used: https://websemantics.uk/tools/image-to-data-uri-converter/ -->
        <style>
          .fulcrum {
             width: 221px;
              height: 205px;
              background-image: url(data&colon;image/png;base64,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);
            }
        </style>
      </html>
    </panel>
  </row>
</dashboard>

###

If this reply helps you, an upvote would be appreciated.

gcusello · ‎05-26-2022

Hi @efavreau,

I tried to use your hint but I have an error in the dashboard editor: "Error on line 31: Invalid character entity" Ciao. Giuseppe

efavreau · ‎05-26-2022

Ciao @gcusello ! Thanks for reaching out!

I can't seem to edit the code in the original answer, maybe it's too old. The error you're seeing was a paste/conversion problem with Community.

The answer I gave contains...

background-image: url(data&colon;image/png;base64

However, the &colon; should be highlighted as the problem. It needs to be an actual colon. This symbol :
If you make that edit, it works.

###

If this reply helps you, an upvote would be appreciated.

brhicke747 · ‎07-09-2020

Thank you! Perhaps you can help me one more time. I have circled the image I am referring to in the photo I have attached. When you create your own app, outside of the "search & reporting" app, this image can be changed. Is there any way to change it after the app has been created and how, if yes?

niketn · ‎07-09-2020

@brhicke747

You would need to place appLogo.png and appLogo_2x.png images in the following folder: $SPLUNK_HOME/etc/apps/<yourAppName>/static

Please try out and confirm! Do upvote the answers, if it works 🙂

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

13tsavage · ‎02-06-2020

Do you have the privileges to copy your image file to $SPLUNK_HOME/etc/apps/your_app/static to your cloud instance? I am not familiar with Splunk Cloud, but I just signed up for the trial to try and figure this out.

brhicke747 · ‎07-02-2020

I am very new to Splunk. Was a solution ever found for this inquiry?

niketn · ‎07-02-2020

@brhicke747
If you have the access to upload asset you can navigating to Manage App. Please try the following where you need to change your Splunk URL and Splunk App Name. If you have access to upload static file, you should be able to upload image.

https://<yourSPLUNKURL>/en-US/manager/launcher/apps/local/<yourAppName>?action=edit

The static file/s uploaded through above approach sits in the following folder:

$SPLUNK_HOME/etc/apps/<yourAppname>/appserver/static

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

How to display an image to be in the centre of two panels in a dashboard in Splunk Cloud?

panel

Extending Observability Content to Splunk Cloud

More Control Over Your Monitoring Costs with Archived Metrics!

New in Observability Cloud - Explicit Bucket Histograms