kurkle / chartjs-chart-sankey

Chart.js module for creating sankey diagrams
MIT License
149 stars 29 forks source link

Pan / Scroll Sankey Chart? #76

Open vade opened 2 years ago

vade commented 2 years ago

Hello

Firstly, thanks for this plugin. I've been able to quickly get some awesome charts going. Much obliged.

For most of my data, I have charts that have a few sources (say 10 or less) and hundreds of outputs. I'd like to vertically scroll the Sankey chart, if possible. Considering the number out connections I have, having a very large vertical canvas results in noticeable lag / overhead.

(ie, simply making the canvas large isn't a great solution as im drawing 4k pixels vertically... )

Id like to limit the drawing and provide some mechanism to vertically scroll / pan. Im aware Chart.js has this feature, but unless I am mistaken I can't seem to find the right way of getting It to work with this plugin.

For example, here's a zoomed out chart to provide a visual example ( had to split it over 2 images)

Screen Shot 2022-09-21 at 10 25 13 AM Screen Shot 2022-09-21 at 10 25 50 AM

Is there a simple example of a working scrolling solution for Sankey charts?

Secondly, is there a way to pin some elements to a fixed / relative to the viewport on screen position? I'd love my left side elements to remain at the top even when scrolling, so one has a consistent reference point.

Thank you again!

kurkle commented 1 year ago

Nice looking chart :)

It could be possible to make this compatible with the zoom plugin, but that would not help with the pinning.

I like the idea of pinning and scrolling. Maybe one level zoom to the smallest column would work and the other columns could then be scrolled? In your case the left column would fill the height and right column would be partially visible (and scrollable).