Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of D3 selection exploration - seperation of concerns

Public visualization

Fork of D3 selection exploration - seperation of concerns

0 stars0🌍 Public
BBart van Pelt
Last edited Jan 4, 2023
Created on Jan 4, 2023

The visualization demonstrates a separation of concerns between data generation and visual rendering in D3.js. It animates a dynamic set of circles, connecting lines, and bar charts that change position, radius, and color over time. The code separates the `makeData` function, which generates the data, from the `vizData` module, which handles the SVG rendering using D3’s selection API and the newer `.join()` method. This example uses `d3.select`, `d3.range`, and `setInterval` to drive a 60 FPS animation, showcasing loose coupling between data and presentation logic.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed