Skip to main content
SimilarExport ZIP
100%

Wykres Słupkowy

✓ Published1🌍 Public
Jjwr2023
Last edited Nov 3, 2023
Created on Nov 3, 2023

This example presents a bar chart depicting product sales across five categories, labeled as Kategoria A through E. The chart renders sales values as steelblue bars within an SVG container, with axes and value labels. The visualization uses D3 version 7, applying the `d3.scaleBand` and `d3.scaleLinear` for axis mapping, and `d3.axisBottom` and `d3.axisLeft` for rendering the axes. Data is hardcoded in the script and displayed using D3's selection and `.enter()` methods.

AI-generated description

A demonstration of how to start using D3 version 6.

MIT Licensed

Similar vizzes

Loading thumbnail…

Sales by Category

This bar chart compares total sales across product categories. The visualization uses aggregated sales data from a CSV file, displaying each category as a steel-blue bar. The chart is built with D3 version 5, using `d3.scaleBand` for the categorical x-axis and `d3.scaleLinear` for the y-axis. The SVG rendering includes axis labels and a title, with the x-axis labels rotated for readability.

Ssaikrishnabussa
75% match
Loading thumbnail…

Product Sales Bar Chart

This bar chart displays product sales figures from a CSV file, with each product’s sales value represented by a steelblue bar. The visualization uses D3.js to create an SVG, scaling the x-axis with `d3.scaleBand` and the y-axis with `d3.scaleLinear`. Axis labels are rotated, and a title is added, all rendered via the D3 SVG API. Data is loaded asynchronously from a GitHub gist using `d3.csv`.

Aavvarijayakrishna99@gmail.com
74% match
Loading thumbnail…

Bar Graph

This bar graph displays five categorical values (ranging from 10 to 30) as steelblue rectangles. Built with D3 v7, the visualization uses `d3.scaleBand` to position categories along the x-axis and `d3.scaleLinear` for the y-axis, with coordinates mapped to 400-by-300-pixel SVG dimensions. The code renders axes using `d3.axisBottom` and `d3.axisLeft`, drawing the chart into an HTML container.

SSriyaI
74% match
Loading thumbnail…

Prosty wykres liniowy

This example demonstrates a simple line chart plotting five data points with x-values from 0 to 4 and corresponding y-values. The visualization uses D3 version 6 to create an SVG rendering, featuring a steelblue line with axes labeled on the left and bottom. The code constructs the chart by applying `d3.scaleLinear` for both x and y axes, using `d3.extent` and `d3.max` to determine domains, and generates the line via `d3.line`. Axis labels are added with text elements, and the y-axis is rotated to display "Wartość".

Jjwr2023
74% match
Loading thumbnail…

sales comparision by segment

A bar chart displays sales figures for each product subcategory, with bars colored steelblue. The visualization uses the D3.js library to load data from a CSV file and scale the x-axis linearly while the y-axis uses a band scale for categorical subcategories. The chart includes axes generated with D3's axis functions, and the SVG rendering shows the total sales distribution across the different product types.

Oosaka004
73% match
Loading thumbnail…

sales comparision by segment

A bar chart displays sales figures for each product subcategory, with bars colored steelblue. The visualization uses the D3.js library to load data from a CSV file and scale the x-axis linearly while the y-axis uses a band scale for categorical subcategories. The chart includes axes generated with D3's axis functions, and the SVG rendering shows the total sales distribution across the different product types.

Oosaka004
73% match
Loading thumbnail…

D3.js Bar Chart Example

This D3.js example shows a straightforward bar chart of categorical data with axes and labels, visualizing values for five categories (A through E). The visualization renders as an SVG, using D3 v6's modular imports including `scaleBand`, `scaleLinear`, `axisLeft`, and `axisBottom` to map the dataset to bar positions and heights. The chart reads its data from a CSV file via `d3.csv`, converting the population column to numeric values, while the styling uses steelblue fills for the bars.

BBhavanaGIrni
73% match
Loading thumbnail…

bar chart

This example shows a small, static bar chart of five categorical values, with each bar colored individually and labeled A through E. The chart displays the data using SVG rectangles, with linear and ordinal scales mapping the values to positions and heights. The code uses d3.js version 3.5, specifically d3.scale.linear and d3.scale.ordinal, along with d3.svg.axis for the x and y axes. The data is hard-coded in the script and rendered on a light grey canvas with margins applied via a group transform.

MMoximillian
73% match