Highlight one bar in a series in highcharts?

2019-07-17 08:31发布

问题:

I have a chart that is showing a stacked and grouped bar chart, similar to this demo.

Is there a way, from JavaScript code, to cause one of the bars in one of the series to become highlighted?

For instance, using the demo linked above, elsewhere on the page the user might select "Pears" for "John", and I want the corresponding Pears bar for John to be temporarily highlighted in the chart.

回答1:

You can use the Point update function

var chart = $('#container').highcharts();
 $('#button').click(function () {
     chart.series[0].data[2].update({y:4,color:'yellow'});
});

EDIT: In case it isn't clear, you don't have to set the y value, you can set just the color.

chart.series[0].data[2].update({color:'yellow'});

http://jsfiddle.net/8vo99a70/

Another Edit: An unhighlight button:

$('#button2').click(function () {
    chart.series[0].data[2].update({
        color: chart.options.series[0].color
    });
});

http://jsfiddle.net/8vo99a70/4/