cannot use several customdata values per data points in go.Pie

[emmanuelle]

See https://codepen.io/emmanuelle-plotly/pen/MWweqey?editable=true and hover: customdata[0] takes all the values whereas it should only take the first one. Is there a problem with the format of customdata?

Raised by https://stackoverflow.com/questions/60158618/plotly-how-to-add-elements-to-hover-data-using-plotly-express-piechart (also see https://github.com/plotly/plotly.py/issues/2210).

[etpinard]

This one is actually not that obvious to solve.

Here's a "working" version: https://codepen.io/etpinard/pen/abOBWJG?editors=1010 where we have

"hovertemplate": "foo:%{customdata[0][0]} <br> bar:%{customdata[0][1]}"

This is because customdata in the pie event data (which is then used to generate text from the hovertemplate) is an array of values e.g

gd.on('plotly_hover', d => console.log(d.points[0].customdata))

gives [ ['a', 'A'] ] when hovering on the biggest sector.

---

Why you may ask? This is to support aggregated pie declarations for example: https://codepen.io/etpinard/pen/abOBWyK?editors=1010

where hovering on the biggest sector gives: [ ['a', 'A'], ['b', 'B'], ['c', 'C'] ] that is it shows the customdata corresponding to all the points contributing to the sector value.

For those interested, the relevant routine is:

https://github.com/plotly/plotly.js/blob/cef9304d2056079164cdc0d3204a25d7e4b79084/src/components/fx/helpers.js#L186-L217

---

One could argue that non-aggregated pies should have event data showing just ['a', 'A'], but I would consider that a breaking change.

[etpinard]

(Removing the bug label)

[emmanuelle]

Thank you @etpinard, it makes sense. We just need to document it! Do you want to close the issue now or wait until documentation examples are added.

[etpinard]

Do you want to close the issue now or wait until documentation examples are added.

It's probably better to move this issue to the documentation repo, but I'll let you decide.

[zared619]

@etpinard Sorry to bring this back from the dead, but something is broken with the example. The hover is broken for the latter two traces. But works for the first two

I'm experiencing a similar issue in my individual implementation.

[AyoCodess]

This one is actually not that obvious to solve.

Here's a "working" version: https://codepen.io/etpinard/pen/abOBWJG?editors=1010 where we have

"hovertemplate": "foo:%{customdata[0][0]} <br> bar:%{customdata[0][1]}"

This is because customdata in the pie event data (which is then used to generate text from the hovertemplate) is an array of values e.g

gd.on('plotly_hover', d => console.log(d.points[0].customdata))

gives [ ['a', 'A'] ] when hovering on the biggest sector.

Why you may ask? This is to support aggregated pie declarations for example: https://codepen.io/etpinard/pen/abOBWyK?editors=1010

where hovering on the biggest sector gives: [ ['a', 'A'], ['b', 'B'], ['c', 'C'] ] that is it shows the customdata corresponding to all the points contributing to the sector value.

For those interested, the relevant routine is:

https://github.com/plotly/plotly.js/blob/cef9304d2056079164cdc0d3204a25d7e4b79084/src/components/fx/helpers.js#L186-L217

One could argue that non-aggregated pies should have event data showing just ['a', 'A'], but I would consider that a breaking change.

This implementation no longer works. Any update?