Skip to main content
SimilarExport ZIP
100%

Activity6_Question2

✓ Published0🌍 Public
PPreethi Medepalli-91
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Activity6_Task2

This example shows the revenue distribution of electric vehicle manufacturers from 2018 to 2021 using a stacked bar chart. The chart uses D3 v7 to load data from a CSV file and render SVG elements, with `d3.stack()` to create stacked series and `d3.scaleOrdinal()` for color mapping. Revenue values are displayed along a linear scale, while manufacturers are positioned on a band scale. The visualization includes axes, bold labels, and a legend to distinguish the four years.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Question2

A stacked bar chart displays quarterly revenue across five product categories—Electronics, Furniture, Clothing, Toys, and Books—from Q1 2022 through Q2 2024. The chart uses D3 v7 to load CSV data, stack values with `d3.stack`, and render series as SVG rectangles with `d3.scaleBand` for the x-axis and `d3.scaleLinear` for the y-axis. Color encoding uses `d3.schemeTableau10`, and each segment is labeled with its value. A separate SVG legend lists the five categories.

Ggroup118sai@gmail.com
83% match
Loading thumbnail…

Activity6-ques2

This stacked bar chart visualizes the distribution of electric vehicle ranges across five car brands using data from ElectricCarData_Clean.csv. Each horizontal bar represents a brand, segmented into five color-coded range bins, from below 200 km to above 500 km. The visualization uses D3.js v7 to process the data, calculate proportional bin frequencies, and render the SVG with scales from `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal`. The chart includes axes with percentage tick formatting via `d3.axisBottom` and a legend.

Kkbhavithareddy06@gmail.com
81% match
Loading thumbnail…

Activity6_Q2

A stacked bar chart displays quarterly sales figures for five car brands—Tesla, Toyota, Ford, BMW, and Mercedes—from Q1 2022 through Q2 2024. The chart is rendered as SVG using D3 v7, with each brand represented by a distinct color from the Tableau10 palette. The code loads data from a CSV file via `d3.csv`, stacks the series using `d3.stack`, and uses `d3.scaleBand` and `d3.scaleLinear` to position bars. Individual segment values are labeled above each bar, with axes and a legend generated by D3’s axis and legend utilities.

TTarshit Vupperla
80% match
Loading thumbnail…

Activity6_Question2

This example shows a horizontal stacked bar chart comparing car specifications—highway MPG, horsepower, and torque—across 31 manufacturers. The data is loaded from a local CSV file and rendered as SVG using D3 v7. The chart uses `d3.stack()` to aggregate the three numeric measures, `d3.scaleLinear()` for the x-axis, and `d3.scaleBand()` for manufacturer categories. Interactive tooltips display exact segment values on hover, and a color-coded legend distinguishes each specification.

JJayanth Reddy Sripathi
80% match
Loading thumbnail…

Activity-6_Question-2

This example shows quarterly sales for three product categories—Electronics, Office Supplies, and Furniture—as a stacked horizontal bar chart. The chart renders with SVG using D3 v7, loading data from a CSV file. The code applies `d3.stack()` to create stacked series, `d3.scaleBand()` for category positioning, and `d3.scaleLinear()` for the value axis. A tooltip appears on mouseover using `d3.select` and event handlers, displaying each segment’s category and sales amount. An ordinal color scale distinguishes the four quarters, with a legend positioned in the chart margins.

HHarshathBudida@my.unt.edu
79% match
Loading thumbnail…

Activity 6 Question 2

This example shows stacked bar charts of sales in dollars across three product categories—Electronics, Furniture, and Clothing—for the years 2018 through 2020. It uses D3 v7 with the `d3.stack` API to layer the series, `d3.scaleBand` for the yearly bars, and `d3.scaleLinear` for the y-axis. Hovering reveals a tooltip with the category and exact value, while a legend identifies each color from `d3.schemeCategory10`, as loaded from a local CSV file.

Aanisha.peddireddy@gmail.com
79% match
Loading thumbnail…

Activity6-TASK2(Question)

This visualization displays monthly car sales for eight models as a horizontal stacked bar chart, with each bar segmented by month from January through August. It uses D3 v7’s `d3.stack` to compute the stacked values, `d3.scaleBand` for the categorical y-axis, and `d3.scaleLinear` for the quantitative x-axis, rendering rectangles within SVG groups. Data is loaded externally from a CSV file via `d3.csv`, and a color-coded legend identifies each month alongside the chart.

Vvinilavoddi@my.unt.edu
79% match
Loading thumbnail…

Activity-6 Q2

This stacked bar chart visualizes car sales distribution across five manufacturers, showing the percentage of cars sold in each price range (below 100, 100-200, 200-300, 300-400, above 400). Each horizontal bar represents a manufacturer, segmented into colored sections for each price bracket. Hovering over any segment displays a tooltip with the precise sales percentage. The visualization uses D3.js v7 with `d3.stack()`, `d3.scaleLinear()`, `d3.scaleBand()`, and `d3.scaleOrdinal()` to create the chart, which is rendered as SVG.

Hharshaps15@gmail.com
79% match