User interactions

Canvas has no DOM nodes, so there is no :hover and no per-shape event. Interaction has to be rebuilt by hand.

Let's find the shape under the cursor with a bit of math, then use a second canvas layer to highlight it without redrawing everything.

Members only

7 minutes read

We've seen how powerful D3 is for transforming a dataset into an SVG path. For example, give it a radius and angle, and it can easily generate an arc path.

But how can we use this same data to draw the shape with canvas? Let's explore.

Oh no! 😱

This lesson isn’t available just yet.

Take a look at the status badges next to each lesson in the sidebar to see when it’s coming out.

Thanks for your patience! 🙏

← Previous

Using paths in canvas

Project