Skip to main content
SimilarExport ZIP
100%

acccc

✓ Published0🌍 Public
Hharshabandi3060@gmail.com
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Hello VizHub

This stacked bar chart shows sales of three products (A, B, and C) across four regions (North, South, East, West). Each bar segments total regional sales by product using a color scale. The visualization uses `d3.stack()` to compute the stacked series, along with `d3.scaleBand()`, `d3.scaleLinear()`, and `d3.scaleOrdinal()`. It renders SVG rectangles with x- and y-axes generated via `d3.axisBottom()` and `d3.axisLeft()`. A legend identifies the product colors. Sample data is hardcoded in the script, and the chart is sized at 600×400 pixels with specified margins.

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…

fork of activity_6_question_2

This stacked bar chart displays product sales (productA, productB, productC) across four regions (North, South, East, West) using D3 v7. The visualization loads CSV data via `d3.csv` with `d3.autoType`, applies a band scale for regions and a linear scale for sales values, and renders SVG rectangles through the `d3.stack` layout. Color encoding uses `scaleOrdinal` with four categorical colors, with axes generated by `axisBottom` and `axisLeft`. A legend shows product categories, and the chart is scoped within defined margins on a 960×500 SVG canvas.

JJaswanthkota@my.unt.edu
84% match
Loading thumbnail…

Activity-6_Question-2.3

This stacked bar chart displays regional sales data for three products across four regions, using a categorical color scale to distinguish each product category. Built with D3 v7, the visualization imports data from a local CSV file and applies d3.stack() to layer the series, with d3.scaleBand() for the x-axis and d3.scaleLinear() for the y-axis. Axes are rendered using d3.axisBottom() and d3.axisLeft(), while a custom legend reflects the stacked order. The SVG output includes hover styling defined in the accompanying CSS.

Ttarun.chintada46@gmail.com
83% match
Loading thumbnail…

Activity-8_Question-2

This example presents a stacked bar chart that visualizes product sales (productA, productB, productC) across four regions (North, South, East, West). It uses D3 v7 to load a CSV file, stack the data, and render SVG bars with a categorical color scale. The chart includes axes for region and sales totals, and a legend identifying each product's contribution to the stack.

Mmanideepchinna25@gmail.com
82% match
Loading thumbnail…

task2

This example presents a stacked bar chart that visualizes the distribution of three product categories (Product A, Product B, and Product C) across four geographic regions: North, South, East, and West. The chart uses SVG rendering to display the bars, with each product assigned a distinct color from the `d3.scaleOrdinal` and `d3.schemeCategory10` color scale. The code utilizes `d3.stack()` with `d3.stackOrderNone` and `d3.stackOffsetNone` to compute the stacked segments from the hardcoded data. A legend is appended to identify each product category, and the chart dimensions are fixed at 600 by 400 pixels.

Kkeerthanachinthalapally@gmail.com
82% match
Loading thumbnail…

Activity 5_Question 3

A stacked bar chart displays regional product sales across four regions, with each bar segmented by product category. The visualization uses D3 v7’s `d3.stack`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal` to render SVG rectangles with color-coded segments per product. Data loads from a CSV file via `d3.csv` with `d3.autoType`, and axes are generated using `d3.axisBottom` and `d3.axisLeft`. A legend maps product names to their ordinal color range, annotating each segment’s contribution.

Ppenujulilikhil01020@gmail.com
81% match
Loading thumbnail…

activity6_question2_11719493

This stacked bar chart displays sales volumes across five regions (North, South, East, West, Central) broken down into five product categories. The horizontal bars are segmented by category, with each region’s total sales represented on a linear scale. Using D3 v7, the code applies `d3.stack()` to aggregate category values, maps regions to a band scale for the y-axis, and retrieves data from `sales_data.csv`. Interactive tooltips appear on mouseover, and a legend is rendered via SVG rectangles and text elements.

Ssravani1969@gmail.com
80% match
Loading thumbnail…

Question2_Activity_6

This example shows a stacked bar chart that breaks down sales of three products—productA, productB, and productC—across four regions (North, South, East, West). The code reads a local `data.csv` file using `d3.csv` and `d3.autoType`, then builds the chart with D3 v7’s `scaleBand` for the x-axis, `scaleLinear` for the y-axis, and `d3.stack` to accumulate the segment values. Each region’s bar is divided into colored segments, with a legend identifying the product categories, and the y-axis is labeled “Sales.” The SVG output is generated directly through D3’s selection and append methods.

SSai Sandhya Nannapaneni
80% match
Loading thumbnail…

Question 3

This stacked bar chart shows the sales performance of six products—Laptop, Smartphone, Tablet, Headphones, Smartwatch, and Camera—across five regions (North, South, East, West, Central). The x-axis represents dollar amounts as a percentage, and the y-axis lists product categories. Built with D3 v7, it uses `d3.stack()` to generate stacked series, `d3.scaleBand` for the y-axis, and `d3.axisBottom` for the x-axis. Mouseover interactions display tooltips showing each region’s percentage contribution. Data comes from an inline CSV file loaded via `d3.csv`.

GGangumalla Ruchitha Reddy
80% match