Skip to main content
SimilarExport ZIP
100%

US CO2 Emmisions by various sectors

✓ Published0🌍 Public
MMalempatiSaranya
Last edited Jul 3, 2022
Created on Jul 2, 2022
Forked from HTML Starter

This interactive line chart displays US CO2 emissions across various sectors over time, with each sector represented by a colored line. It uses Vega-Lite's API through the `vega-lite-api` library, running on D3.v5, to encode the temporal data with a zero-suppressed quantitative y-axis for CO2 in billion metric tons. The visualization pulls data from a remote CSV file and renders as scalable vector graphics with tooltips showing the year.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

US CO2 Emmisions by sector in 2018

This visualization shows US CO2 emissions by sector from 2018, using a line chart where each sector’s annual emissions trace a colored line over time. The chart is built with the vega-lite-api, which wraps Vega-Lite and Vega, and loads data from a GitHub Gist via d3.csv. The code configures axis and label styling through a custom config object, and the lines are rendered with an opacity of 0.8 and a size of 5. The data source is the US Energy Information Administration.

88Tigers2020
91% match
Loading thumbnail…

CO2 Chart: Multiple Bars

This chart displays projected CO2 emissions in billion metric tons by sector from 2020 to 2030, using grouped bars for each year. It employs D3 v5 with `scaleBand` for both year and sector categories, `scaleLinear` for values, and `scaleOrdinal` for color mapping. The data originates from the US Energy Information Administration via a GitHub Gist, rendered as SVG with axes, a title, and a legend.

88Tigers2020
76% match
Loading thumbnail…

CO2

This line chart shows CO2 emission values from 2000 to 2014, with each data point marked by a circle that reveals its exact value on hover via a tooltip. The visualization uses D3 v4 to render an SVG with time-scaled X axis and linear Y axis, applying a basis curve to smooth the line path. It loads data from a CSV file and demonstrates axis customization, interactive mouse events, and tooltip styling.

Llamiyaa
74% match
Loading thumbnail…

CO2

This line chart shows CO2 emission values from 2000 to 2014, with each data point marked by a circle that reveals its exact value on hover via a tooltip. The visualization uses D3 v4 to render an SVG with time-scaled X axis and linear Y axis, applying a basis curve to smooth the line path. It loads data from a CSV file and demonstrates axis customization, interactive mouse events, and tooltip styling.

Llamiyaa
74% match
Loading thumbnail…

test_data

This visualization uses a Vega-Lite API to render an interactive line chart of CO2 emissions over time, with three distinct types compared via colored lines. The chart encodes Year on the x-axis, emission amount on the y-axis, and type as color, with tooltips showing year values. Data from a CSV file is loaded via d3.csv, and the vega-lite-api library, combined with vega-tooltip for hover interactions, generates the SVG output. The visualization fills the entire browser window and uses custom axis styling.

Jjjacobatandover
74% match
Loading thumbnail…

Vega Chart - Emissions by Year

This example shows annual emissions totals as a filled area chart, with color encoding representing solid emissions by year. The visualization uses the Vega Lite API, registered with Vega and React, to render SVG output. Data is loaded via `d3.csv` from a GitHub-hosted CSV file. The chart is configured with custom axis styles, a black color scheme, and tooltips provided through the `vega-tooltip` Handler, scaling responsively to the window size.

AAmeer Nuri
74% match
Loading thumbnail…

CO2 Emissions Data Time Series Line Chart

This chart displays CO2 emissions over time for multiple countries using a line chart, with each country assigned a distinct color from D3’s `schemeCategory10` palette. The x-axis represents time, and the y-axis represents emissions. Data points are emphasized with circular markers. The visualization is rendered using D3.js (version 7.8.5), employing `scaleLinear` for axes, `scaleOrdinal` for color encoding, and `line` to generate smooth paths connecting the data points.

Oomniaabouhassan@gmail.com
74% match
Loading thumbnail…

CO2 Emissions Over Time

This example displays a stacked area chart of global CO2 emissions over time, broken down by source categories such as gas, liquids, and cement production. It uses D3.js with React, rendering as SVG. The code applies a time scale for the x-axis and a linear scale for the y-axis, with d3.area to draw the stacked paths and d3.areaLabel to position labels. Data is loaded from a CSV file and filtered to exclude dates before 1790.

PPriyaEnuganti
73% match