Fork of HTML Starter

100%

Fork of HTML Starter

✓ Published0🌍 Public

Last edited Oct 20, 2025

Created on Oct 20, 2025

This bar chart displays categorical values from a remote CSV file hosted on GitHub. The visualization uses D3.js v7 to load the data with `d3.csv` and renders it as an SVG. The chart's y-axis is scaled linearly with `d3.scaleLinear` and includes nice tick marks, while the x-axis uses `d3.scaleBand` for categorical spacing. The code appends steelblue rectangles, rotates x-axis labels, and adds a title, with margins and axes positioned via SVG transforms.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of HTML Starter

This bar chart displays the value of each category, sorted in descending order. Built with D3 v7, it loads data from a CSV file via a Gist URL using `d3.csv` and `d3.autoType`. The visualization uses a band scale for categories, a linear scale for values, grid lines, rotated axis labels, and a tooltip that appears on mouseover.

SSYAM TEJ

89% match

Loading thumbnail…

Fork of HTML Starter

A bar chart displays national-level data from a CSV dataset, filtered to include all years for the "National" level. The visualization uses D3.js to create an SVG rendering, with a band scale for the x-axis and a linear scale for the y-axis. Bars are drawn as rectangles filled with steelblue, and axes are generated using `d3.axisBottom` and `d3.axisLeft`. The data is loaded asynchronously via `d3.csv` from a GitHub gist URL.

Pprathyusha-reddy-arch

87% match

Loading thumbnail…

Fork of HTML Starter

This example displays a static bar chart of 100 randomly generated quantitative data points, visualizing each item’s value as a vertical steelblue rectangle. It uses D3 v7 with an SVG rendering approach, employing `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for the y-axis, and `d3.axisBottom` and `d3.axisLeft` for tick marks. The code generates the dataset in-browser using `Math.random()`, applies rotated labels to sparse x-axis ticks, and includes chart and axis titles for context.

Yyazneshpara2@gmail.com

86% match

Loading thumbnail…

Fork of HTML Starter

This interactive bar chart visualizes the distribution of tree species from a CSV dataset, displaying the count of each species alongside tooltips that reveal average height and circumference. Built with D3 v7, the visualization employs `d3.csv` for data loading, `d3.rollups` for aggregation, and `d3.scaleBand` and `d3.scaleLinear` for axes. Bars animate upward on load, use a green sequential color scale, and respond to hover with opacity changes. The SVG rendering includes rotated x-axis labels and a styled title.

Aanirudhrao345@gmail.com

85% match

Loading thumbnail…

Fork of Fork of HTML Starter

A bar chart displays average marks per subject, computed from a CSV dataset of student scores. The visualization uses D3.js v6 to load the data, calculate averages with `d3.mean`, and render SVG rectangles scaled by `d3.scaleBand` and `d3.scaleLinear`. Axes are added via `d3.axisBottom` and `d3.axisLeft`, with labels and a title. Bars turn orange on hover through CSS, and the chart includes rotated x-axis tick labels and clear axis annotations.

Vvenigallajaanu@gmail.com

84% match

Loading thumbnail…

Fork of Hello HTML

This example displays a CSV dataset loaded from a GitHub Gist, summarizing the total row count and previewing the first five records in an HTML table. It then renders an SVG bar chart showing the first column as categorical labels on the x-axis and the second column as quantitative values on the y-axis using `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisBottom`/`d3.axisLeft`. The chart title and axes are added via D3 selections. Styling uses embedded CSS, and data loading relies on `d3.csv`.

Ssowjanyateppali4202@gmail.com

83% match

Loading thumbnail…

Fork of HTML Starter

A dark-themed dashboard loads a local CSV file via D3 v7, summarizes the data into three key performance indicators, and renders a bar chart of a selected numeric column. The SVG visualization uses D3 scales, axes, and a linear gradient fill for the bars. The page includes a file picker, controls for selecting columns, and a fixed 420-pixel chart area.

MManeesh Kumar

83% match

Loading thumbnail…

Fork of Fork of HTML Starter

This example presents a health data visualization comprising three charts: a bar chart of Var1, a line chart showing Var2 over time, and a pie chart of Var3. It loads CSV data from a GitHub gist and uses D3.js v7 to render SVG elements. The bar chart maps data points to horizontal bars, the line chart uses scales and a line generator to plot the time series, and the pie chart uses `d3.rollups` to aggregate categories. The code includes axes and margin conventions for the line chart.

Aakhilakura@my.unt.edu

83% match