Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Mouse círculo

Public visualization

Viewing a saved revision (read-only)

bc7db6cc3f9c48739cf3e02543e191f9

Mouse círculo

0 stars0🌍 Public
Ffcordon@pin.upv.es
Last edited Feb 9, 2025
Created on Feb 9, 2025

This example demonstrates a single red circle that follows the mouse cursor across the visualization canvas. The circle's position updates directly in response to pointer movement, with the cursor’s coordinates captured from each mouse event. The implementation uses d3’s `select` and `pointer` functions within an interactive SVG, where a `mousemove` handler triggers state updates via a spread operator to maintain an immutable state object. The circle’s `cx` and `cy` attributes are then re-rendered from the updated state, showcasing a simple, reactive update pattern.

AI-generated description

A program that follows the mouse around and changes its color using immutable update patterns.

Challenge

  • Use this pattern to make something else respond to mouse events