Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

Restyle specific points in a trace

I am trying to implement a “click to highlight” behavior on bar chart. Using the code below:

myPlot.on(‘plotly_click’, function(data){
var update_color = new Array(data.points[0].data.x.length)
update_color.fill(’’);

 update_color[data.points[0].pointNumber] = 'rgb(255, 65, 54)'
            
 var update = {marker: {color: update_color}}
            
 Plotly.restyle(myPlot, update, 0);

});

But the empty strings in the update object turn the unselected bars into black. I also tried to use ‘undefined’, and it cannot maintains the current format either. Any clues?

Hi there,
There is a similar example here: https://plot.ly/javascript/plotlyjs-events/#click-event that may be helpful for you

1 Like

That helps. Thanks for sharing!