Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

ICE-6 Student Marks BarChart

Public visualization

Viewing a saved revision (read-only)

b309fc544f524cfb8b384e81eb327bb3

ICE-6 Student Marks BarChart

0 stars1🌍 Public
Cchalasanigayaetiri@gmail.com
Last edited Mar 20, 2024
Created on Mar 19, 2024

This example visualizes student marks as a bar chart using React and D3. It shows the total marks for each student, with bars encoded by height on a linear scale and names on a band scale. The code fetches CSV data from a remote URL, parses it, and renders an SVG with rectangular bars using `scaleBand` and `scaleLinear`. It leverages React’s `useState` and `useEffect` for data loading, and D3’s `axisBottom` and `axisLeft` for axes. The chart uses a green fill for bars and includes margins and a title, with no interactive or animated behavior.

AI-generated description

Visualization of total cancer deaths by state from the CORGIS dataset made with D3. Color legend and threshold code from Susie Lu.

Hover over bars to see precise values. Fullscreen to see legend.