Dashboards & Visualizations

In web frame work 6 how to add time picker to bubble chart example

satish99
New Member

My requirement is that to add timepicker to bubble chart developed in d3 code simple_xml_examples.
I have tried following to implement suggeted in below example but it is not working
http://answers.splunk.com/answers/107934/timerange-picker-on-splunk-6-new-web-framework?page=1&focus... but still it not working.

can any one plz help me with implementtation.

Thanks

Tags (2)
0 Karma

aelliott
Motivator
{% timerange id="timerange1" preset="Last 30 days"  %}
 {% searchmanager
    autostart=True
    id="bubbleSearch"
        search="InsertSearchHere"|token_safe}

and a little javascript:

var deps = [ "splunkjs/ready!",
     "splunkjs/mvc/searchmanager",
 "splunkjs/mvc/timerangeview" ];

require(deps, function (mvc) {
var timerange = splunkjs.mvc.Components.getInstance("timerange1");
var bubbleSearch = splunkjs.mvc.Components.getInstance("bubbleSearch");
bubbleSearch .search.set(timerange.val());
timerange.on("change", function () {
    //Set timerange for searches.
     bubbleSearch.search.set(this.val());
    });

});
0 Karma

MaverickT
Communicator

Unfortunately I cant paste you whole file, but here is my implementation - step by step:

Timerange picker in {% block content %}

{% timerange id="timerange1" preset="Last 7 days"  earliest_time="$earlyval$"|token_safe latest_time="$lateval$"|token_safe %}

Bubblechart in {% block content %}

{% bubblechart id="map_clients"  managerid="search_incidents_client" valueField="count" labelField="ClientName" categoryField="ClientName" %}

Search manager in {% block managers %}

{% searchmanager
    id="search_incidents_client"
    search="index=autosupport (sourcetype=critical OR sourcetype=error OR sourcetype=warning) earliest=$earlyval$ latest=$lateval$ | sort -_time | fields + ClientName |  stats count by ClientName"|token_safe
    enable_lookups="true"
    app="ourspaceautosupport"
%}

And thats pretty much about it! 🙂

0 Karma

satish99
New Member

thanks MaverickT even this did not help

0 Karma

MaverickT
Communicator

I dont think I understand you correctly, but you have to include $time1$ in search manager. I added variable $time2$ as latest date of event. Search manager code should be something like this:

{% searchmanager
id="bubbleSearch"
search="source=\"mysource.log\" earliest=$time1$ latest=$time2$ | stats count by sourcetype"|token_safe
enable_lookups="false"
app="search"
%}

0 Karma

satish99
New Member

I am not sure how to replace values form the example that you posted.here is the sample HTML code.$time1$ is input type.

0 Karma
Get Updates on the Splunk Community!

Introducing the 2024 SplunkTrust!

Hello, Splunk Community! We are beyond thrilled to announce our newest group of SplunkTrust members!  The ...

Introducing the 2024 Splunk MVPs!

We are excited to announce the 2024 cohort of the Splunk MVP program. Splunk MVPs are passionate members of ...

Splunk Custom Visualizations App End of Life

The Splunk Custom Visualizations apps End of Life for SimpleXML will reach end of support on Dec 21, 2024, ...