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!

Webinar Recap | Revolutionizing IT Operations: The Transformative Power of AI and ML ...

The Transformative Power of AI and ML in Enhancing Observability   In the realm of IT operations, the ...

.conf24 | Registration Open!

Hello, hello! I come bearing good news: Registration for .conf24 is now open!   conf is Splunk’s rad annual ...

ICYMI - Check out the latest releases of Splunk Edge Processor

Splunk is pleased to announce the latest enhancements to Splunk Edge Processor.  HEC Receiver authorization ...