hover events for labels/legends

[tlrdstd]

I would like to be able to know when the user hovers or clicks on my label or legend items. Specifically, I would like to be able to highlight a given pie slice or bar trace when a particular label or legend item is hovered over. d3pie does this, and an example can be seen here: http://d3pie.org/#generator-start

As a starting point, it would be useful to have this click handler fire an event after it calls Plotly.restyle or Plotly.relayout:

plotly.js/src/components/legend/index.js

Line 484 in 47b13b0

traceToggle.on('click', function() {

A hover handler for the same traces would help a lot as well.

[etpinard]

I really like this idea.

Custom legend item click handlers could be set in the plot config e.g.:

Plotly.plot('graph', [], {}, {
   onLegendItemClick: function(data) {
      /* do something wilh data */
   }
}

The current handler would simply be the default.

[alexcjohnson]

The current handler would simply be the default.

or, as in some other cases like plotly_beforeplot, it will still execute the default handler unless you return false from the custom handler

[Abildtoft]

Thanks for an awesome library. Can I ask what the status is with regards to this?

[abalter]

Here is a hacky way to do it. I did "inspect element" on a legend item and found that it has a class legendtoggle. Using this,

$('.legendtoggle').on('click', function(data)
{
    alert("legend clicked");
})

It doesn't say which trace item was clicked. However, if you are truly dedicated, you can climb back up to the legend group tag, then back down to the text element and grab the data-unformatted value.

[joeymink]

We would like to give a user the ability to select series colors after viewing a plot. Ideally they would interact with the legend to do so. Another vote to resolve this issue :)

[mauritzvdworm]

Another vote here.

Another use for this would be if you have a plot with a collection of line graphs corresponding to different groups. The user could then hover over the legend to highlight the particular plot similar to the d3pie example above.

[aliavni]

+1

[cutalion]

+1

[acailly]

+1