🌍 Public
ICE-6: rendering Marks and channels with react and D3
TTharun Reddy
Last edited Mar 12, 2023
Created on Mar 11, 2023
This example visualizes the top 100 movies by IMDB rating as a horizontal bar chart, though it currently displays only the first five entries from a CSV dataset. The chart uses React for component state management, with D3 v5 handling scales, axes, and data loading via `d3.csv`. Marks are rendered as SVG `<rect>` elements, with `scaleBand` for the y-axis and `scaleLinear` for the x-axis, and the code draws custom tick labels and gridlines. It encodes movie names and ratings through spatial position and bar length.
AI-generated descriptionMIT Licensed
Comments
Sign in to join the discussion.