Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

task2_q1

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

82039d8c53344647bcfd52a2a700d00f

Open

task2_q1

0 stars0🌍 Public
Bbadiniswetha@gmail.com
Last edited Apr 6, 2025
Created on Apr 4, 2025
Forked from Hello VizHub

This stacked bar chart shows agricultural trade data for Afghanistan from 2014 to 2018, displaying Import, Export, Production, and Consumption values per year. Each bar segment represents one category, with colors distinguishing the four metrics. The visualization uses D3.js v7 with `d3.stack()` to compute the stacked series, `d3.scaleBand()` for the x-axis years, and `d3.scaleLinear()` for the y-axis values. Data is hardcoded in the script rather than loaded from the accompanying CSV file. The chart renders as SVG with axis generators `d3.axisBottom()` and `d3.axisLeft()`.

AI-generated description

Stacked Bar Chart - Air Pollution in China

This project visualizes average air pollution levels by city using a stacked bar chart with D3.js.

Files

  • index.html: Main HTML file containing D3.js visualization.
  • style.css: Styling for the page and chart.
  • air_pollution_china.csv: Dataset containing pollution and environmental data.
  • README.md: Project overview and instructions.

How to Use

  1. Make sure all files are in the same directory.
  2. Open index.html in a web browser.
  3. The chart will load and display average pollution levels by city.

Requirements

  • No local server needed. Just open index.html directly.
  • Internet connection required to load D3.js from CDN.