Dashboards & Visualizations

How to embed JavaScript and CSS within the dashboard or panel?

garinapavan
Explorer

Hi,

I have a dashboard which with javascript and custom style sheet and I have them in $SPLUNK_HOME/etc/apps//appserver/static/

But I want to have that code within the below dashboard code and at the panel level instead of putting the files in /appserver/static/ folder. Can you provide some examples how to put the javascript code and style sheet code within my panel?

Below is my Dashboard code :

<dashboard script="table_cell_highlighting.js" stylesheet="table_cell_highlighting.css">
  <label>cellcoloring</label>
  <row>
    <panel>
      <table id="highlight">
        <search>
          <query>host=abc  source="access.log*"  |stats  perc90(duration) as Duration,perc95(duration) as ninetyfifth by   service_name | sort -count</query>
          <earliest>-60m@m</earliest>
          <latest>now</latest>
        </search>
      </table>
    </panel>
  </row>
</dashboard>

Any help is appreciated !

rjthibod
Champion

You can put CSS inline in an html element under a row element like this

<row depends="hiddenCSS">
  <html>
    <style> 
      /*insert CSS here, can only reference classes and IDs, no selectors */
    </style>
  </html>
</row>

You CANNOT embed Javascript inside of a SimpleXML dashboard. It can only be loaded from files like you are doing.

0 Karma
Get Updates on the Splunk Community!

Stay Connected: Your Guide to July Tech Talks, Office Hours, and Webinars!

What are Community Office Hours?Community Office Hours is an interactive 60-minute Zoom series where ...

Updated Data Type Articles, Anniversary Celebrations, and More on Splunk Lantern

Splunk Lantern is a Splunk customer success center that provides advice from Splunk experts on valuable data ...

A Prelude to .conf25: Your Guide to Splunk University

Heading to Boston this September for .conf25? Get a jumpstart by arriving a few days early for Splunk ...