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
Got questions? Get answers!

Join the Splunk Community Slack to learn, troubleshoot, and make connections with fellow Splunk practitioners in real time!

Meet up IRL or virtually!

Join Splunk User Groups to connect and learn in-person by region or remotely by topic or industry.

Get Updates on the Splunk Community!

Splunk Add-on for Microsoft Windows 11.0.3: Parse Once, Search Faster

The updated Splunk Add-on for Microsoft Windows helps customers search Windows events faster by reducing ...

What's New in Splunk Enterprise Security 8.8 and Beyond

Threats move at machine speed. Keeping up should not depend on having the biggest budget, the largest team, or ...

A Four-Part Event Series: State of Observability - Where AI Meets Performance

As AI agents take on more complex tasks, teams need greater visibility into how they behave, what they cost, ...