Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Hello HTML

✓ Published1🌍 Public
Ssivaniammisetti2002@gmail.com
Last edited Mar 9, 2026
Created on Mar 9, 2026
Forked from Fork of Hello HTML

This bar chart visualizes daily step counts over a 120-day period, with each bar representing one day and its height corresponding to the number of steps taken. The chart includes labeled axes for day and steps, plus a title, and uses axis ticks only for every tenth day to reduce clutter. The visualization loads CSV data via `d3.csv` from a GitHub gist, then uses `d3.scaleBand` for the x-axis and `d3.scaleLinear` for the y-axis. Bars are drawn as SVG rectangles using D3 v7's data join, with axes generated by `d3.axisBottom` and `d3.axisLeft`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of D3 Starter barrr

This visualization displays a horizontal bar chart highlighting the top 10 days with the highest step counts from a 160-day fitness activity dataset. Each bar is colored with a distinct pastel hue and includes a numeric value label at its tip. Built with D3 v7, the code loads CSV data via `d3.csv`, sorts and filters the records, then uses `d3.scaleBand` and `d3.scaleLinear` to position bars and axes. The SVG render includes custom axis labels and a bold title.

Kkanaparthieshitha@gmail.com
88% match
Loading thumbnail…

Fork of React & D3 Starter

This visualization combines bars and lines to compare daily fitness metrics—calories burned, steps walked, and active minutes—across 150 days. It shows all three trends on a single SVG chart, with steps scaled down to fit the axis. The code uses D3 v7 APIs such as `scaleBand`, `scaleLinear`, `axisLeft`, and `d3.line` to render the chart, while React handles the page setup. Data comes from a CSV file loaded via `d3.csv`, and the rendering uses SVG elements like `rect` and `path`.

Kkarthikpavan1198@gmail.com
82% match
Loading thumbnail…

Fork as scatter plot

This scatter plot visualizes the relationship between daily step counts and calories burned, using a dataset loaded from a gist CSV. The chart, built with D3 v7, maps steps to the x-axis and calories to the y-axis via linear scales, rendering each data point as a small circle. It uses `d3.csv` to parse the data, `d3.scaleLinear` for axis scaling, and `d3.axisBottom` and `d3.axisLeft` to generate the axes, with a title and axis labels added as SVG text elements.

Ssivaniammisetti2002@gmail.com
81% match
Loading thumbnail…

Fork of Untitled

This bar chart displays the daily earnings of individuals, with each person’s name on the x-axis and their corresponding amount on the y-axis. The visualization uses D3 v6 to load CSV data asynchronously via `d3.csv`, then binds it to SVG rectangles scaled by `d3.scaleBand` and `d3.scaleLinear`. Axes are generated with `d3.axisBottom` and `d3.axisLeft`. The chart is rendered as static purple bars within an SVG canvas, with axis labels positioned manually via HTML divs.

VVineela Reddy
80% 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
80% 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
79% match
Loading thumbnail…

Fork of HTML Starter

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.

Yyazneshpara2@gmail.com
79% match
Loading thumbnail…

Fork of bar D3 Starter

This bar chart visualizes product sales values from a CSV dataset, with each bar representing a product and its height corresponding to the sales figure. The chart includes axis labels, a title, and interactive hover effects that display a tooltip and change the bar’s color. Built with D3.v7, it uses `d3.csv` to load the data, `d3.scaleBand` and `d3.scaleLinear` for scales, and `d3.axisBottom`/`d3.axisLeft` for axes, all rendered as SVG within a styled HTML page.

119h61a05c9@cvsr.ac.in
79% match