Skip to main content
SimilarExport ZIP
100%

Stacked bar chartIPL

✓ Published0🌍 Public
Sskambhore04
Last edited Apr 5, 2022
Created on Apr 5, 2022

This stacked bar chart displays IPL match data, with the y-axis showing dates and the x-axis representing a quantitative value. The chart splits the data into positive and negative stacked segments, using a Tableau10 color scheme to distinguish categories. It uses D3 v5 with `d3.stack`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the visualization, rendering as SVG from a CSV file.

AI-generated description

Stacked bar chart with negative values.

MIT Licensed

Similar vizzes

Loading thumbnail…

D3.js bars and charts

This visualization displays a horizontal bar chart of cricket player statistics from IPL 2021, ranking players by their total runs scored. Each bar represents a player, with the x-axis showing run counts and the y-axis listing player names from the loaded CSV dataset. The chart is rendered using D3.js v7 within a React framework, employing d3.csv for data loading, d3.scaleLinear and d3.scaleBand for scales, and d3.axisLeft and d3.axisBottom for axes. The visualization uses SVG rendering with steelblue bars to encode the quantitative values.

AAyushman
77% match
Loading thumbnail…

stacked bar

A stacked bar chart displays records published by month in 2015, broken into four categories: Geographic, Dataset, Application, and WebService. The chart uses D3.js (v3.5.5) to load the CSV data from `views.csv`, compute cumulative y-values for each segment, and render colored rectangles per category. An ordinal x-scale maps months, a linear y-scale encodes total counts, and a legend identifies the color-coded categories. The SVG rendering includes axes formatted with the `.2s` tick format and uses `d3.svg.axis` for the bottom and left axes.

MMbrownshoes
74% match
Loading thumbnail…

Fork of Fork of AVN - ICE5

This example shows a horizontal bar chart of IPL winners, with team names on the y-axis and prize money in million dollars on the x-axis. The chart uses d3.scaleLinear for the x-axis, d3.scaleBand for the y-axis, and d3.axisLeft and d3.axisBottom to render the axes. Data is loaded from a remote CSV using d3.csv, with prize values coerced to numbers. Bars are drawn as SVG rectangles filled with steelblue, and the chart includes a title and axis label.

Cchandanagandla
74% match
Loading thumbnail…

Fork of Fork of AVN - ICE5

This example shows a horizontal bar chart of IPL winners, with team names on the y-axis and prize money in million dollars on the x-axis. The chart uses d3.scaleLinear for the x-axis, d3.scaleBand for the y-axis, and d3.axisLeft and d3.axisBottom to render the axes. Data is loaded from a remote CSV using d3.csv, with prize values coerced to numbers. Bars are drawn as SVG rectangles filled with steelblue, and the chart includes a title and axis label.

Cchandanagandla
74% match
Loading thumbnail…

D3 Layouts - Stacked bar chart

This example shows a stacked bar chart built with D3.js, using the `d3.stack` API to arrange three categories—apples, oranges, and grapes—into cumulative segments for five data groups. The visualization renders directly to an SVG element, with each stacked segment colored via `d3.scaleOrdinal` and the `d3.schemeCategory10` palette. A band scale positions the bars horizontally, while a linear scale maps the cumulative totals to the chart’s height, with the stacking order sorted descending. The input dataset is a hardcoded array of objects.

KKaustav Sen
73% match
Loading thumbnail…

AVN - Fork of Let's make a Bar Graph with D3.js

This example visualizes IPL final results from 2008–2022 as a horizontal bar chart, showing prize money in crores for each winning team alongside their captain and runner-up. It loads external CSV data using `d3.csv`, then renders SVG rectangles positioned with `scaleBand` and `scaleLinear`. The chart applies `axisBottom` with tick formatting, removes default domain lines, and labels axes and title. Data values are parsed to numbers before rendering. The visualization uses D3 v7 with a static SVG container sized 960×500.

Aavnreddy95
73% match
Loading thumbnail…

Fork of 3D Bar Chart using D3.js

This example visualizes IPL match data for 2017 as a 3D multi-series bar chart, showing six monthly values (January through June) for each manufacturer. The chart uses D3.js v5 with the d3-3d extension for 3D bar geometry, rendered via X3DOM through the d3-x3d library’s `barChartMultiSeries` component. Data is loaded asynchronously from a CSV file using D3’s `csv` function, with rows parsed into key-value pairs. The visualization initially displays random dataset2 from d3-x3d before replacing it with the real CSV data on load.

AAsherpranayp
73% match
Loading thumbnail…

Fork of Fork of Fork of AVN - ICE5

This bar chart displays IPL winners and their prize money in millions of dollars, with teams on the y-axis and prize amounts on the x-axis ranging from 0 to 15. Using D3 v5, it applies `scaleLinear` for the x-axis and `scaleBand` for categorical team labels, with `axisLeft` and `axisBottom` generating the axes. The SVG rendering includes a title, axis label, and steel-blue rectangles, with data loaded via `d3.csv` from a GitHub gist. Tick formatting uses `format('.3s')` to abbreviate large numbers.

Cchandanagandla
73% match