🌍 Public
Kyle's Mouse Follower
A circle tracks the mouse across a full-screen SVG, with its color and radius changing continuously based on the cursor's x and y coordinates. The example demonstrates a unidirectional data flow pattern: mouse events trigger a `setState` callback, which updates a centralized state object that drives the rendering. Using D3 v7's `select`, `join`, and event handling, the circle's `cx`, `cy`, `r`, and `fill` attributes are recomputed from the current state on each render. The color is derived from the coordinates in an RGB string, creating a gradient-like effect as the mouse moves.
AI-generated descriptionA circle that follows the mouse using unidirectional data flow. And changes the color and size of the circle based on its position in the frame.
MIT Licensed








Comments
Sign in to join the discussion.