Skip to main content
SimilarExport ZIP
100%

Presentation_Task6

✓ Published0🌍 Public
Rrikhitakoganti12
Last edited Jul 26, 2023
Created on Jul 26, 2023

This stacked area chart visualizes the total products available across five categories—Cosmetics, Clothing, Food/Beverages, Technology, and Books/Toys—from 2010 to 2023. Using d3.stack and d3.area with curveBasis, the SVG rendering displays each category as a filled area, colored via d3.scaleOrdinal with d3.schemeDark2. Labels are positioned through d3-area-label, while axes use d3.axisBottom and d3.axisLeft with a time scale for years. The code reads data from a CSV file and includes hover tooltips via SVG title elements.

AI-generated description

A stacked area chart of Global CO2 Emissions.

The segments "Solids", "Liquids", and "Gas" are the forms of fossil fuels being burned.

Uses d3-area-label to position labels.

Inspired by Scott Judson’s Block: Global Carbon Emissions Area Chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

Presentation_Task1

This chart displays the relationship between product quantity and price for five product categories, with each category represented by a distinct color: Clothing, Food & Beverage, Technology, Cosmetics, and Shoes. The data comes from a remote CSV file loaded via the `csv` function, and the visualization is rendered as an SVG using D3.js v5. The code uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to construct the axes, and `select` appends the chart to the body. Each data point is drawn as a circle with a fixed radius, and the color is determined by the category using a custom switch function.

Rrikhitakoganti12
82% match
Loading thumbnail…

Presentation_Task4

This bar chart displays the average customer spending on each product category, with horizontal bars representing the price values from the dataset. The visualization uses D3 v5 to load CSV data and render an SVG, employing `scaleLinear` for the x-axis and `scaleBand` for the categorical y-axis. Axis labels are generated with `axisLeft` and `axisBottom`, while each rectangle’s height is set using the y-scale’s bandwidth, and hover effects reduce opacity via CSS.

Rrikhitakoganti12
78% match
Loading thumbnail…

Presentation_task3

This pie chart visualizes the number of unique products purchased across different shopping malls, with each slice colored and labeled by product count. Built with D3 v5, the visualization uses `d3.pie` and `d3.arc` to generate segments, `d3.scaleOrdinal` for color mapping, and `d3.format` for numeric tick labels. Data is loaded from a CSV file via `d3.csv`, and the SVG rendering includes interactive legends displaying mall names and corresponding values.

Rrikhitakoganti12
76% match
Loading thumbnail…

Presentation_Task2

This visualization shows a red line chart tracking product prices from 2019 to 2023, with each year plotted as a point connected by a path. The data, loaded from a CSV file containing shopping mall transaction records, is aggregated by year. The code uses D3 v7 to create an SVG graphic, employing `d3.scaleBand` for the x-axis years, `d3.scaleLinear` for the price range, and `d3.line` to generate the path. Axes are added with `d3.axisBottom` and `d3.axisLeft`, and text labels identify the year and price dimensions.

Rrikhitakoganti12
75% match
Loading thumbnail…

Assignment_2_Task_2_Stacked_Bar_Chart

This stacked bar chart visualizes sales data across market segments, with each bar segmented by product sub-category. The visualization uses D3.js to load CSV data and render an SVG, featuring an interactive color legend that filters and highlights specific sub-categories on hover. The chart includes tooltips showing exact sales values and uses d3.legend for the color key, while the stack layout computes cumulative values for each segment.

Ssreekarthanda@gmail.com
75% match
Loading thumbnail…

Activity8_Task4

This area chart visualizes the cost of sales from 2000 to 2013, using a smooth curve to connect annual data points and a light green fill beneath the line to emphasize the trend. The visualization is built with D3 v5, employing `scaleTime` and `scaleLinear` for axes, along with `line` and `area` generators with `curveBasis` to create the smooth path. Data is loaded from a CSV via `d3.csv`, parsed into `Date` and numeric cost values, and rendered as an SVG with styled axis labels and tick marks.

Rrikhitakoganti12
74% match
Loading thumbnail…

Stacked_Bar_chart

This example presents a stacked bar chart of randomly generated product sales data across six months. The chart visualizes sales for ten product categories, with each bar segmented by month using a categorical color scheme. Built with D3.js v7, the code generates data on the fly and renders the visualization as an SVG. The implementation uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.schemeCategory10` for color assignment, along with D3's axis helpers for labeling.

Ppardha1411
74% match
Loading thumbnail…

D3 Layouts - Stacked area chart

A stacked area chart shows monthly U.S. electric vehicle sales from December 2010 to June 2013, with each category rendered as a filled layer. The code uses `d3.stack` with descending order and `d3.area` to generate SVG paths, colored via `d3.schemeCategory10`. It parses dates with `d3.timeParse` and scales axes with `d3.scaleTime` and `d3.scaleLinear`. Data comes from a remote CSV file, and axes are drawn using `d3.axisBottom` and `d3.axisRight`. The chart is fixed at 800×350 pixels.

KKaustav Sen
74% match