Developing for Splunk Enterprise

Multiple Timeline graphs on a single webpage Javascript SDK

Engager

I am attempting to display multiple timeline graphs on the same webpage via the JavaScript SDK. The first graph shows up, but the second one does not. In firebug, I can see both jobs get created, but only div id timeline-container0 is populated by a timeline graph. I wasn't sure if I am overwriting a variable or there is some type of race condition going on..... any insight would be greatly appreciated.

Code:




How to start a Splunk session

<link href="/examples/browser/resources/bootstrap.css" rel="stylesheet">
<link href="/examples/browser/resources/prettify.css" type="text/css" rel="stylesheet" />
<link href="/examples/browser/resources/timeline.css" type="text/css" rel="stylesheet" />

<style type="text/css">

timeline-container0 {

height: 250px;
width: 500px;
}

timeline-container1 {

height: 250px;
width: 500px;
}





Timeline Graph 1




Timeline Graph 2





Tags (2)
0 Karma
1 Solution

Engager

Not sure if this is the best way to go about this ... but I got it to work by creating a second spunk.ui.timeline.js file and calling it in the second script which then generates the second timeline graph successfully.

Updated this line to point to the second version of spunk.ui.timeline:

var timelineToken = splunkjs.UI.loadTimeline("/client/splunk.ui.timeline2.js", function() {

View solution in original post

0 Karma

Engager

Not sure if this is the best way to go about this ... but I got it to work by creating a second spunk.ui.timeline.js file and calling it in the second script which then generates the second timeline graph successfully.

Updated this line to point to the second version of spunk.ui.timeline:

var timelineToken = splunkjs.UI.loadTimeline("/client/splunk.ui.timeline2.js", function() {

View solution in original post

0 Karma
Don’t Miss Global Splunk
User Groups Week!

Free LIVE events worldwide 2/8-2/12
Connect, learn, and collect rad prizes and swag!