Dashboards & Visualizations

jquery dashboard

csimonnet
New Member

Hi,
I would like to have the weather on a panel in my dashboard. My code works but not with Splunk.
xml:

<dashboard script="clock.js, weather.js" stylesheet="clock.css, weather.css">
 <row>
    <panel>
      <html>
        <div class="weather" id="weather"></div>
      </html>
    </panel>
  </row>
</dashboard>

javascript:

require([
       "splunkjs/ready!",
       "splunkjs/mvc/simplexml/ready!",
       "jquery"
     ], function($) {

$(document).ready(function() {
var weatherUrl = 'https://query.yahooapis.com/v1/public/yql?q=select%20item.condition%20from%20weather.forecast%20where%20woeid%20in%20(select%20woeid%20from%20geo.places(1)%20where%20text%3D%22lyon%22)%20and%20u%3D%22c%22&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys'

$.getJSON(weatherUrl,function(data) {
var result = data.query.results.channel.item.condition;
var code = result.code;
var currently = result.text; 
var temp = result.temp; 
var image = 'https://s.yimg.com/zz/combo?a/i/us/nws/weather/gr/' + result.code + 'd.png';
var units = 'C'


html = '<h2><i class="icon-'+code+'"></i> '+temp+'&deg;'+units+'</h2>';
 html += '<ul><li>'+'Lyon'+', '+'France'+'</li>';
html += '<li class="currently">'+currently+'</li>';
 $("#weather").html(html);

});
});
});

What I have to do?

0 Karma

niketn
Legend

@csimonnet if this is working for you in HTML and not in Splunk, can you share a screenshot of what output you need from your HTML code? Also what is the CDN/reference URL for clock and weather JavaScript libraries?

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
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!

Make Your Machine Data AI-Ready in Splunk

Every team is getting ready for AI agents.   Thursday, November 12, 2026  |  11AM  PST / 2PM EST   ...

Splunk Asynchronous Forwarding Explained

Splunk asynchronous forwarding is often misunderstood as simply setting autoLBVolume. That is not quite right. ...

How to Monitor AI Agents with Splunk Agent Observability

Let’s say I’m running a travel planning AI app in production. A user asks for three concise hotel options in ...