Dashboards & Visualizations

How to force re-rendering of chart elements in HTML dashboards?

smichalski
Explorer

Hi everybody,

inside our Splunk 6.1 HTML dashboards, we use a custom CSS to increase the charts' font-size and JS to hide and display element-groups on user interaction. Basically, this does work. Unfortunately on charts that had been hidden at the initialization of the dashboard and displayed subsequently, larger legends get partially cut off or unreadably condensed.

I assume that is because Splunk renders the Highcharts invisibly with some default values, so that a re-displayed chart gets spoiled when the browser applies the custom CSS belatedly. If you change the height of the chart manually by dragging its resize-bar, the chart gets re-rendered with the correct proportions and everything looks fine again. Is there a way to bin re-rendering/re-drawing/re-freshing of a single chart or all charts to something else, like clicking a link? So that re-rendering is triggered when the show/hide link is clicked.

I experimented on something like the following (jQuery) which would work, but it ignores a defined height and sets the chart back to 250px default:

$('a#mylink').on("click", function(event) {
    element1.render();
});

Any better ideas?

Cheers, Sven

piUek
Path Finder

How are You hiding these charts?
And how/where do You set chart height?

There are few ways for re-rendering the charts or managing their attributes, but You have to use splunkjs to get to them. In example type this in javascript console:

get the list of splunk elements (to get the chart):

splunkjs.mvc.Components.getInstanceNames();

get Your chart:

var chart = splunkjs.mvc.Components.getInstance('example-chart');

hide chart:

chart.hide();

show chart:

chart.show();

change chart height:

chart.settings.set('height', 600);

kartik13
Communicator

Hi,
I am trying to change the search to which it is linked . After changing it i want to re render the chart with new values.
Can you update on this, if it is being solved.

Thanks

0 Karma

ankit_vasudeva
Engager

I am facing similar issue. Did you get any solution?

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!

Network to App: Observability Unlocked [May & June Series]

In today’s digital landscape, your environment is no longer confined to the data center. It spans complex ...

SPL2 Deep Dives, AppDynamics Integrations, SAML Made Simple and Much More on Splunk ...

Splunk Lantern is Splunk’s customer success center that provides practical guidance from Splunk experts on key ...

[Puzzles] Solve, Learn, Repeat: Matching cron expressions

This puzzle (first published here) is based on matching timestamps to cron expressions.All the timestamps ...