Skip to main content
SimilarExport ZIP
100%

Bar Chart

✓ Published0🌍 Public
MMJR1997
Last edited Dec 5, 2018
Created on Dec 5, 2018

This bar chart displays the number of contributions made by each author, sourced from a CSV file. The chart renders as steelblue rectangles via SVG. The code uses d3’s `select`, `csv`, `scaleLinear`, and `max` functions to load the data and map the maximum contribution count to the scale’s domain, though the current implementation sets a fixed rectangle size rather than scaling the bars to their data values.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

D3 Bar Chart

This bar chart displays the number of contributions per author from a local CSV file, with values multiplied by 1,000 for scaling. The visualization uses D3 v5 to load the data, apply a linear scale for the x-axis and a band scale for the y-axis, and render steel-blue bars in an SVG. Axes are added using `axisLeft` and `axisBottom`, while styling is handled through an external stylesheet.

MMJR1997
93% match
Loading thumbnail…

Fork of Making a Bar Chart

This horizontal bar chart displays the count of contributions per GitHub login, sorted by the login name. It uses D3 version 5 APIs including `scaleBand` and `scaleLinear` to map the data, and `axisLeft` for the y-axis. The chart reads from a CSV file, and the bars are rendered as SVG rectangles filled with steelblue using the `svg.append` method. The data is parsed to convert string counts to numbers before the chart is generated.

Ddabreadman (YI XIANG TAN)
77% match
Loading thumbnail…

Bar Chart

This bar chart displays categorical data from a CSV file, with steel-blue rectangles representing values across categories. The visualization uses D3.js to load and bind the data, then scales the rect elements’ heights and positions based on the dataset. Text labels accompany each bar, rendered via SVG. The styling, including margins and font sizes, is defined in a separate stylesheet, while the chart is generated dynamically in an HTML page that reads the data source.

AAndrew-Kiwa
76% match
Loading thumbnail…

Bar Chart

This bar chart displays yearly counts from a CSV dataset, with steel-blue rectangles representing each year’s value. The visualization uses D3 v5 to load and parse the data, then applies `scaleLinear` for the horizontal axis and `scaleBand` for vertical positioning. SVG elements are appended directly to the chart, with axes omitted from the final rendering. The bars scale in width according to the year values while maintaining equal heights for each band.

EErik Rudhe
75% match
Loading thumbnail…

Basic bar chart

This basic bar chart displays yearly values from a CSV file, with bars colored blue and highlighted on hover. It uses D3 v4 to load the data via `d3.csv`, scales with `d3.scaleBand` and `d3.scaleLinear`, and renders SVG rectangles. The chart is configured as a reusable template, where users can edit column names, axis labels, and colors in a designated section. Axes are drawn using `d3.axisBottom` and `d3.axisLeft`, with labels positioned manually. The example is a fork of Mike Bostock’s original bar chart block, adapted for CSV input.

EEndNight95
74% match
Loading thumbnail…

Bar chart

This bar chart displays categorical data from a CSV file, mapping values to vertical bars within an SVG container. The example uses D3 v6’s `select` and `csv` methods to load and parse the external dataset, while the SVG’s width and height attributes are read to define the chart’s dimensions. Currently, the code logs the parsed data to the browser’s developer console but does not render any bars, serving as a minimal starting point for a React-based visualization.

SShirish Kandra
74% match
Loading thumbnail…

Making Bar chart with D3

A bar chart displays monthly values from a CSV file, using horizontal bars where length encodes value and vertical position encodes date. The visualization is built with D3 v5, using `scaleLinear` for the value axis, `scaleBand` for the categorical date axis, and `axisLeft`/`axisBottom` for tick marks. SVG rectangles are rendered from the loaded data, with axes simplified by removing domain and tick lines.

JJuan David Bolaños Rojas
73% match
Loading thumbnail…

Bar Chart I

This bar chart visualizes six numeric values—4, 8, 15, 16, 23, and 42—as horizontal bars whose widths are proportional to the data. The chart uses D3 v3’s `d3.scale.linear` to map the domain from zero to the maximum value (42) onto a pixel range of 0–420. Each bar is a styled `div` element with a steelblue background, white text, and a width set via the `style` operator. The code appends these divs using `d3.select` and `.selectAll("div").data(...)`, with the data bound to the DOM. The bars’ labels display the original values.

Mmbostock
73% match