Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Mouse Follower

Public visualization

Viewing a saved revision (read-only)

71682bbe7abc44b482cf22ebb9a17058

Mouse Follower

0 stars0🌍 Public
Yyanaltingliu
Last edited Nov 3, 2021
Created on Nov 3, 2021

A mouse follower renders a single black circle on an SVG canvas that tracks the pointer’s position in real time. It visually demonstrates interactive coordinate tracking, updating the circle’s center to match the cursor’s clientX and clientY location. The React component uses the useState hook to store the mouse position and a useCallback handler on the SVG’s onMouseMove event to update state on every movement. Rendered via ReactDOM, the SVG circle’s cx and cy attributes are set from this state, with d3.v5 loaded for potential utility but not directly used in this logic.

AI-generated description

A program that follows your mouse with a circle