Green house gas bar chart

100%

Green house gas bar chart

✓ Published19🌍 Public

Last edited Dec 15, 2022

Created on Dec 13, 2022

Forked from Let's make a Bar Graph with D3.js

A horizontal bar chart displays 2019 greenhouse gas emissions (in MtCO₂e) for eleven top-GDP countries, with population values from `data.csv`. Steel-blue bars encode emissions magnitude on a linear scale, while country names align on a band scale. The SVG rendering uses D3 v7’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the plot and axes. Interactive hover effects reveal a custom tooltip with the emission value, and the bar fill darkens via `attr("fill")` on mouse events.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Green house gas bar chart

A horizontal bar chart displays 2019 greenhouse gas emissions in MtCO₂e for the top 11 GDP countries, using population values from a CSV as the quantitative variable. The visualization, built with D3 v7, uses `scaleLinear` and `scaleBand` to map data to SVG rectangles, with `axisLeft` and `axisBottom` for axes. Hovering over a bar reveals a tooltip with the exact emission value, while the bar’s fill darkens briefly. The chart includes a title and renders with a clean, margin-based layout.

CCharlie Smith

93% match

Loading thumbnail…

Fork of Green house gas bar chart

CCharlie Smith

93% match

Loading thumbnail…

Fork of Green house gas bar chart

This horizontal bar chart displays greenhouse gas emissions in 2019 for the top 11 GDP countries, with each bar’s length representing the population metric from the `data.csv` file. The visualization employs D3 v7’s `scaleLinear` and `scaleBand` for axes, `axisLeft` and `axisBottom` for ticks, and SVG `<rect>` elements drawn on a 960x500 canvas. A custom tooltip appears on mouseover, showing the emission value, and the bars are colored steelblue via CSS. The chart includes a title and margin-based layout.

HHoyeoun

92% match

Loading thumbnail…

Fork of Green house gas bar chart

This bar chart displays 2019 greenhouse gas emissions for the top 11 GDP countries, using population data from a CSV file. Horizontal bars are rendered as SVG rectangles, with countries ordered along the y-axis and emissions scaled linearly on the x-axis. The visualization uses D3 v7 APIs including `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`, and includes interactive tooltips that appear on mouseover, showing each country’s emission value in MtCO₂e.

Mmavercikalvin

92% match

Loading thumbnail…

Fork of Green house gas bar chart

A horizontal bar chart displays greenhouse gas emissions (in MtCO₂e) for the top 11 GDP countries, sorted by population. Each bar’s length encodes emissions, with hover interactions triggering a tooltip and a subtle color shift. The visualization uses D3 v7’s `scaleLinear`, `scaleBand`, and SVG rendering, reading data from a CSV. Bars animate on mouseover via D3 transitions, while the axis and tooltip are generated with `axisLeft`, `axisBottom`, and custom DOM styling.

Mmythili

92% match

Loading thumbnail…

Fork of Green house gas bar chart

This example displays a horizontal bar chart of greenhouse gas emissions for the top 11 GDP countries in 2019, using data from a CSV file loaded via d3.csv. The chart maps emission values to bar widths with d3.scaleLinear and country names to y-axis positions with d3.scaleBand, rendering in SVG. Interactive tooltips appear on mouseover, showing the emission value in MtCO₂e, while bars darken on hover. The visualization uses d3.axisLeft and d3.axisBottom for axes and is built with React and D3 v7.

NNikithakatta30

90% match

Loading thumbnail…

Fork of Green house gas bar chart

This bar chart displays greenhouse gas emissions (in MtCO₂e) for several countries, using horizontal bars ordered by country name. Built with D3 v7, it maps population values to a linear x-scale and country names to a band y-scale, rendering SVG rectangles with axes. A custom tooltip appears on mouseover, showing the emission value, while the bar color darkens slightly on hover. Data is loaded from a CSV file and parsed as numbers before rendering.

VVitor Leonel

89% match

Loading thumbnail…

asnn2_task1

A horizontal bar chart displays the greenhouse gas emissions in 2019 for the top 11 GDP countries, using a dataset with country names and population values. The chart, rendered as SVG with D3 v7, maps population to bar width on a linear scale and country names to vertical bands on a band scale. Tooltips appear on hover, showing the exact emission value, and the bars darken temporarily when the mouse is over them. The visualization includes axis labels and a title, with axes generated using `axisLeft` and `axisBottom`.

Mmandadi1999

88% match