Bar chart

Project 1 — Bar Chart

A bar chart displays aggregated values by category, with interactive controls that let users choose the categorical and numeric columns to visualize. The chart loads data from a local CSV file using `d3.csv` with `d3.autoType` to infer column types, then builds a sorted bar layout. The D3 v7 code uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, grid lines via `d3.axisLeft`, and tooltips that follow the mouse. The bars are filled with a blue color, and axes are automatically labeled and rotated for readability.

SSYAM TEJ

Mmalampatiramya03@gmail.com

Project Bar Chart

This bar chart displays the average salary in USD for various job titles, using data loaded from a CSV file via d3.csv. Each bar is colored with a categorical scale (d3.scaleOrdinal and d3.schemeCategory10) and shows a hover tooltip with the title and salary. The chart uses d3.rollup to calculate mean salaries, d3.scaleBand and d3.scaleLinear for axes, and includes rotated x-axis labels for readability.

Presentation_Task4

This bar chart displays the average customer spending on each product category, with horizontal bars representing the price values from the dataset. The visualization uses D3 v5 to load CSV data and render an SVG, employing `scaleLinear` for the x-axis and `scaleBand` for the categorical y-axis. Axis labels are generated with `axisLeft` and `axisBottom`, while each rectangle’s height is set using the y-scale’s bandwidth, and hover effects reduce opacity via CSS.

Rrikhitakoganti12

A bar chart displays the running total of a dataset from 1949 to 2019, with each year’s cumulative value shown as a horizontal steelblue bar. The chart uses d3.csv to load the data, then d3.scaleLinear for the x-axis and d3.scaleBand for the y-axis. Axes are rendered with d3.axisLeft and d3.axisBottom, while the x-axis labels are formatted with d3.format using a '.3s' suffix.

JJagan

Bar chart

A bar chart displays the relative proportions of work, stop, and idle time for four crews, using horizontal stacked bars. Each crew’s row is composed of three colored segments whose lengths correspond to the numeric values from the CSV data. The visualization uses D3 v5’s `csv`, `scaleLinear`, `scaleBand`, `scaleOrdinal`, `axisLeft`, and `axisBottom` to load the data, position the bars, and render axes in SVG. A static color scale assigns distinct hues to the three activity categories.

Bar chart

This example shows a horizontal timeline of events for different crews, with colored bars marking periods of work, stops, and idle time. The code loads data from a CSV file and uses D3’s `scaleTime`, `scaleBand`, and `scaleOrdinal` to map dates, categories, and colors, while `axisBottom` renders the time axis. The SVG is sized at 960 by 120 pixels, and rectangles are filled with green via CSS, though the visible chart only displays the empty axes scaffolding.

72% match

Bar chart

72% match

Bar chart