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
Get Updates on the Splunk Community!

Splunk Observability Cloud’s AI Assistant in Action Series: Analyzing and ...

This is the second post in our Splunk Observability Cloud’s AI Assistant in Action series, in which we look at ...

Elevate Your Organization with Splunk’s Next Platform Evolution

 Thursday, July 10, 2025  |  11AM PDT / 2PM EDT Whether you're managing complex deployments or looking to ...

Splunk Answers Content Calendar, June Edition

Get ready for this week’s post dedicated to Splunk Dashboards! We're celebrating the power of community by ...