Skip to main content
SimilarExport ZIP
100%

activity6_q3

✓ Published0🌍 Public
RRJVENKATESH789@GMAIL.COM
Last edited Apr 11, 2024
Created on Apr 11, 2024
Forked from Hello VizHub

This example presents a stacked horizontal bar chart visualizing mobile brand sales across four quarters. The data is loaded from a CSV file, and each brand’s quarterly sales are stacked to show total price contributions. The chart is rendered as an SVG using D3 v7, with axes, a title, and a color-coded legend. Hovering over a bar segment triggers a tooltip displaying the brand and its specific sales value. The visualization employs D3’s scaleBand, scaleLinear, stack, and axis functions to construct the layout and interactions.

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_Q2

This stacked bar chart visualizes mobile phone sales across four brands (Samsung, Nokia, Motorola, Redmi) and four fiscal quarters, using D3 v7 with SVG rendering. The chart displays quantitative price data along the x-axis and categorical brand groups along the y-axis, with each bar segment colored by quarter. Interactive mouse events trigger tooltips showing the exact sales value for each segment. The visualization uses d3.stack for data aggregation, d3.scaleOrdinal for color mapping, and d3.scaleBand/scaleLinear for axes, with data loaded from the provided CSV.

Tthakurnikhitha4@gmail.com
88% match
Loading thumbnail…

Activity6-Question2

This visualization shows quarterly sales data for product categories using a stacked horizontal bar chart. Each bar segment represents a quarter’s sales contribution, with an interactive tooltip displaying the specific category and sales amount on mouseover. The example demonstrates D3 v7’s `d3.stack` for data shaping, `d3.scaleBand` and `d3.scaleLinear` for axes, and `d3.axisLeft`/`d3.axisBottom` for rendering. Data comes from an inline CSV file loaded via `d3.csv`, and the chart is rendered as SVG with a custom legend.

SSaiKiranReddyKancharla@my.unt.edu
87% match
Loading thumbnail…

Activity6_Q2.3

This stacked bar chart visualizes the distribution of smartphone sales across five price categories for ten brands, with each bar normalized to show proportions of total sales. The D3.js v7 code loads data from a CSV file and renders an SVG visualization, using `d3.stack()` to create stacked segments, `d3.scaleOrdinal()` for color mapping, and `d3.axisBottom()` with percentage tick formatting. Interactive tooltips display the exact percentage for each segment on hover, while a legend identifies the color-coded categories.

MMeghana Sadhu
87% match
Loading thumbnail…

Activity6_Task2

This stacked bar chart visualizes quarterly sales across four product categories—Electronics, Clothing, Furniture, and Books—with each bar segment colored according to category and overall height reflecting total quarterly revenue. The visualization loads data from a CSV file using `d3.csv`, then applies `d3.stack()` to compute cumulative segment values, `d3.scaleBand()` for quarter positioning, `d3.scaleLinear()` for the y-axis, and `d3.scaleOrdinal()` for categorical colors. Axes are rendered with `d3.axisBottom` and `d3.axisLeft`, while SVG rectangles represent each stacked segment, and a bold "Total Sales" label marks the highest y-value.

Kkeerthanachinthalapally@gmail.com
86% match
Loading thumbnail…

activity 6_q3

This horizontal stacked bar chart displays sales data for five beauty products, breaking down total sales into two colored segments: Price and Quantity, with product names on the y-axis and the aggregated sales value on the x-axis. Built with D3.v7, the visualization uses `d3.scaleLinear` and `d3.scaleBand` for axes, `d3.stack()` to compose the stacked segments, and `d3.axisBottom`/`d3.axisLeft` for tick marks. The SVG rendering includes color encoding via `d3.scaleOrdinal` for the two stacked categories, with a legend and concise axis labels, drawing from a local dataset where each row specifies product, brand, price, and quantity.

Sshettisowmya01@gmail.com
86% match
Loading thumbnail…

act6 q2

This example shows a stacked bar chart of sales by category across four quarters, with tooltips revealing exact values per segment. It uses D3 v7’s `d3.stack`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisLeft`/`axisBottom` to render an SVG. The code loads data from a local CSV, applies an ordinal color scale, and builds an interactive hover tooltip with D3 selections.

Sshravan.s0710@gmail.com
86% 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
86% match
Loading thumbnail…

Activity6Question2

This stacked bar chart shows quarterly sales totals across three product categories—Electronics, Clothing, and Home Goods—using D3 v7 to render SVG. The chart uses `d3.stack()` to create stacked segments and `d3.scaleOrdinal()` for color mapping, with `d3.axisBottom` for the x-axis. Hovering over any segment reveals a tooltip displaying the exact sales value for that category and quarter. Data comes from a hardcoded CSV structure with quarter and category columns.

Gganesh.hns48@gmail.com
85% match