Transform cartesian charts on pointer drag / scroll

[techniq]

Similar to the Zoomable Map, but should work for cartesian charts (LineChart, ScatterChart, etc) and not affect the axises (just the marks, etc). Similar to the Brush minimap example, but within a single chart and using pointer events (drag, scroll, etc)

Related

• https://observablehq.com/@d3/pan-zoom-axes
• https://observablehq.com/@d3/zoomable-bar-chart
• https://observablehq.com/@didoesdigital/26-june-2020-d3-bar-chart-brush
• https://observablehq.com/@yurivish/coordinated-views
• https://observablehq.com/@heman/zooming-usability
• https://www.layerchart.com/docs/components/BrushContext#minimap
• Brush / Scrubbing #15
• Pan/Zoom/Draggable #16
• https://observablehq.com/d/3989a37ce59c3a2e
• https://observablehq.com/@vega/vega-lite-scatterplot-pan-zoom
• Zoomable Area

[mitjakukovec]

I checked all the examples and reviewed the source code but could not find a supported approach to zooming and panning the line chart data range.

Am I missing something, or is this not supported yet?

Thanks

[techniq]

Hey @mitjakukovec 👋

No examples or official support yet, but @coryvirok has been exploring this in #439 (example). Still a lot of investigation and refinement to be done, but so far this has been completed with existing constructs. See also the related discord thread.