Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Follow Mouse

Public visualization

Follow Mouse

0 stars0🌍 Public
Jjunxiangyao
Last edited Oct 30, 2020
Created on Oct 30, 2020
Forked from Let's Make a Face

A circle follows the mouse cursor within an SVG canvas as the user moves over it. The example uses React state (`useState`) to track cursor position and a `useCallback` handler with `onMouseMove`. Position is derived from the `clientX` and `clientY` event properties. The visualization renders with SVG, using d3.v5 for the drawing context and React 17 for component logic.

AI-generated description

Things covered:

onMouseMove even.clientX (screenX is for screen, clientX is for the svg tag in this context) useState - beaware of the location useCallback

Comments

Sign in to join the discussion.

MIT Licensed