Black Lives Matter. Please consider donating to Black Girls Code today.

Marker points color change based on box selection and lasso selection events


I have created the plotly line chart using the plotly module. By using Box select and Lasso select to select one or multiple points, and i was able to change the color of that selected marker by capturing the event ‘plotly_selected’. Here’s the sample code used to change the color of the marker on selection.

element.on(‘plotly_selected’, function(eventData) {
var x1 = ;
var y1 = ;
var colors = ;
for(var i = 0; i < eventData.points.length; i++) colors.push(color1);
eventData.points.forEach(function(pt) {
colors[pt.pointNumber] = color1;
Plotly.restyle(element, {
x1: [x1, y1],
xbins: {}
Plotly.restyle(element, ‘marker.color’, [colors],[0]);

But I want to change the color of selected marker points present in the line chart based on a value that user selects in dropdown. So we want to capture the event data when "plotly_selected’ event occurs and pass this data to another function where we will call this function from the html based on selection of the drop down value. But we’re unable to do so in this approach.

Could someone please help me on how to proceed further or if there’s any another approach to implement this functionality.

Thanks in advance.