Skip to main content
100%

ICE-6: Rendering Marks and Channels with React & D3.JS

✓ Published1🌍 Public
BBajiSharifPatan@my.unt.edu
Last edited Mar 6, 2022
Created on Mar 6, 2022

This example visualizes the most nuclear-using countries in 2020 as a horizontal bar chart, with country names on the y-axis and nuclear values on the x-axis. It uses React to manage state and render the SVG, while D3.js v5 handles data loading and scaling. The code specifically employs `scaleBand`, `scaleLinear`, and `csv` from D3 to parse and map data, with custom axis ticks drawn manually. React's `useEffect` and `useState` hooks load and store the data, which comes from a CSV file hosted on GitHub.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes