All examples By author By category About

mbostock

Drag & Zoom II

This example shows how to combine d3-drag and d3-zoom to allow dragging of individual circles within a zoomable SVG. If you click and drag on the background, the view pans; if you click and drag on a circle, it moves.

This is quite a bit simpler than implementing drag-and-zoom with Canvas, since the SVG element automatically provides hit-testing, coordinate system transformation and re-rendering.