Dashboards & Visualizations

Show customized tool tip on mousehover for all the bars available for a specific legend on a bar chart


Hi Splunkers,

I am trying to achieve a customized tool tip to be shown for all the available bars in the chart on mousehover on a specific legend of a specific bar in a  bar chart.

I have checked different answers, but still finding difficult crack this one.

For reference please find the image attached, 

1) Tool tip should be customized with only the number shown below, need to remove the other information.

2) On mousehover on any one of the bars, the tooltip with the value count(number) for other bars should also be displayed on their respective bars along with bar on which the mousehover was happening.

ex: In below bar chart, the tool tip on mousehover on the left most bar should also bring the tool tip for the other 3 bars available to its right in their respective bars. Where the tooltip should only contain the passed(legend) value, which is total count/number of passed.

Please suggest me the available options, which I can try,.

Advance thanks for the support.




Labels (6)
0 Karma


1) Possible with CSS


div[id="panelid"] div.highcharts-tooltip table.highcharts-tooltip tbody tr:nth-child(1),
div[id="panelid"] div.highcharts-tooltip table.highcharts-tooltip tbody tr:nth-child(2) td:nth-child(1) {
    display: none !important;


2) Not possible with CSS as only one tooltip is displayed at any one time and the data for the other bars is not present in table.

0 Karma
.conf21 Now Fully Virtual!
Register for FREE Today!

We've made .conf21 totally virtual and totally FREE! Our completely online experience will run from 10/19 through 10/20 with some additional events, too!