Apexcharts.js: Feature Request: Public methods for toggling Series data. (Like clicking legend)

Created on 5 Oct 2018  路  4Comments  路  Source: apexcharts/apexcharts.js

Is your feature request related to a problem? Please describe.
Its common to build custom legends for better display when there are a large amount of series data. eg. content categorization with 16 categories. Typically we'll build a custom dropdown similar to https://codepen.io/elmahdim/pen/hlmri with an additional option to deselect (hide) all.

Currently we build custom filters to remove the deselected items and update the series data. This works without any issue but seems like a hack.

Describe the solution you'd like
Public Methods for show/hide/toggle should be added allow you to pass the series name that will hide the data just like if you clicked the built in legend series name.

Describe alternatives you've considered
Filters series data based on custom legend options and then update the series data.

Additional context
Screen shot of a custom legend. http://take.ms/BNT52

As another reference point for a similar library, c3 exposes a single toggle method on the chart. Example https://c3js.org/samples/legend_custom.html

Most helpful comment

Released a patch release 2.1.4 to support toggleSeries() programmatically.

chart.toggleSeries('seriesName')

Docs
Codepen demo: https://codepen.io/junedchhipa/pen/YJQKOy

All 4 comments

Interesting. The fact that legends are drawn by SVG elements (unlike tooltips which are drawn by HTML elements) makes customizing the legend a bit harder. Some users also faced issues in legend placements when there are too many items in legend.

I will surely work on this feature request in the upcoming releases.
Thanks for the suggestion

+1.
I love that tooltips are HTML, so easy to customize, so HTML legend would be great as well.

Released a patch release 2.1.4 to support toggleSeries() programmatically.

chart.toggleSeries('seriesName')

Docs
Codepen demo: https://codepen.io/junedchhipa/pen/YJQKOy

Heck Yeah! Thanks for tackling so quickly.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

tcarlsen picture tcarlsen  路  3Comments

pribilinskiy picture pribilinskiy  路  3Comments

drew-dulgar picture drew-dulgar  路  3Comments

frlinw picture frlinw  路  3Comments

drummad picture drummad  路  3Comments