Mark Hanly

@MarkHanly·3 public vizzes

Fork of Mouse Follower

A single circle follows the mouse cursor inside an SVG canvas. The circle is initially centered and jumps to the exact screen coordinates of the pointer on every move. The interaction is built with React hooks, `useState` and `useCallback`, to track the cursor position and trigger an alert on click. The SVG element handles both `onMouseMove` and `onClick` events within the 960 by 500 pixel viewport.

Sep 26, 2023

Loading thumbnail…

Loading data with fetch

This example demonstrates how to load and read external data using the browser’s native Fetch API within a plain HTML page. It defines an asynchronous function, `fetchText`, that fetches a URL and returns the response as text. The code then applies this function to a CSV file containing named CSS colors from a GitHub gist, and logs the resulting text to the console. The example is minimal, focusing solely on the data-loading step with no visualization or rendering yet.

Sep 26, 2023

Loading thumbnail…

Mark's Hello HTML part 1

A smiling face rendered in SVG, built with React components that compose independently defined parts: a yellow face, eyes, and a mouth. The eyes use offset circles for pupils and highlights, while the mouth combines a d3 arc path with a simple rectangle. The visualization demonstrates modular component reuse and declarative SVG construction, leveraging the React and d3 libraries.

Sep 20, 2023