Miguel Salazar

@msalazark·3 public vizzes

Loading CSV

This example demonstrates how to load a CSV file and display a summary of its contents. It shows the file size in kilobytes, the number of rows, and the number of columns. The code uses D3 version 7’s `d3.csv` function to fetch and parse the data from a GitHub gist, then formats the message with `textContent`. It also includes an alternative async/await approach using `fetch` and `d3.csvParse`.

Feb 7, 2022

Loading thumbnail…

Mouse Follower

A circle follows the mouse cursor across an SVG canvas, updating its position in real time as the user moves the pointer. The React component uses the `useState` hook to store mouse coordinates and the `useCallback` hook with an `onMouseMove` event handler to update them. It renders a single `<circle>` element with the React DOM, ensuring smooth tracking without any external data source.

Jan 28, 2022

Loading thumbnail…

Fork of HTML Starter

A grid of 18 cartoon faces renders in SVG via React, each with randomized eye sizes while sharing identical yellow circular heads, black outlined eyes, and a fixed arc-shaped mouth. The component-based architecture demonstrates composition through reusable Face subcomponents. It uses D3 v7's `arc` generator to construct mouth paths and `range` for the grid layout, rendered declaratively with ReactDOM.

Jan 4, 2022