π Public
ICE-6 Rendering Marks and Channels with React & D3
SShishiraRudrabhatla
Last edited Jun 25, 2022
Created on Jun 25, 2022
A horizontal bar chart displays revenue for ten cosmetic products, with purple bars and blue axes on an SVG canvas. React manages the state and rendering loop, while D3 v5 functions (`csv`, `scaleBand`, `scaleLinear`, `max`) load the CSV data and compute scales. D3's `csv` fetches the data from a GitHub Gist URL, and the chart maps product names to y-axis positions and revenue values to bar widths.
AI-generated descriptionAn example showing the capabilities of VizHub:
- Loads D3 via UNPKG.
- Demonstrates use of
importfrom"d3". - Demonstrates use of
importfrom local ES6 modules.
MIT Licensed
Comments
Sign in to join the discussion.