Refactor Project zzz3

100%

Refactor Project zzz3

✓ Published0🌍 Public

Last edited Nov 4, 2017

Created on Nov 4, 2017

This visualization animates cumulative greenhouse gas emissions for selected countries from 1990 to 2013, showing stacked bar segments per country that grow over time. Each bar represents a country’s annual emissions added to its cumulative total, with color encoding distinct nations and a ranking filter limiting the display. The code uses D3 v4 with an SVG rendering approach, employing `d3.scaleBand` for the categorical x-axis and `d3.scaleLinear` for the y-axis. Data is loaded from a CSV file and filtered dynamically by year, with tooltips providing interactivity.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/RobertDelgado/'>RobertDelgado</a>'s block: <a href='http://bl.ocks.org/RobertDelgado/8908f51789711630c7eda701ed609030'>Refactor Project</a>

forked from <a href='http://bl.ocks.org/RobertDelgado/'>RobertDelgado</a>'s block: <a href='http://bl.ocks.org/RobertDelgado/21ddfa6647b685286d4b84136cd0a639'>Refactor Project zzz</a>

forked from <a href='http://bl.ocks.org/RobertDelgado/'>RobertDelgado</a>'s block: <a href='http://bl.ocks.org/RobertDelgado/fb8324c54fd58f95b1caeed39f967a2c'>Refactor Project zzz2</a>

forked from <a href='http://bl.ocks.org/RobertDelgado/'>RobertDelgado</a>'s block: <a href='http://bl.ocks.org/RobertDelgado/f823d3683bb591bac643bfc7cf35d6a4'>Refactor Project zzz2</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Refactor Project zzz2

This animated visualization tracks cumulative greenhouse gas emissions for multiple countries from 1990 to 2013, showing each nation’s annual contribution as stacked horizontal bars. A floating tooltip, implemented with d3-tip and custom labels, reveals exact values on hover. The rendering uses D3 v4 with scaleBand and scaleLinear axes, while transitions update bar positions and highlight top and bottom performers across years. Data comes from the included CSV file, with countries ranked by total emissions over the period.

RRobertDelgado

95% match

Loading thumbnail…

Refactor Project zzz2

This animation visualizes cumulative greenhouse gas emissions (GHG_Cum) for multiple countries from 1990 to 2013, with each year rendered as a separate horizontal bar chart. The visualization highlights yearly changes in both cumulative emissions and the contribution of each year's emissions, using connecting marks to trace trajectories. Built with D3 v4, the code employs `d3.scaleBand` and `d3.scaleLinear` for axes, uses `generalUpdate` and `generalEnter` helper functions to manage SVG elements, and incorporates interactive tooltips via d3-tip. Data is sourced from a CSV file containing country-level GHG, population, and ranking information.

RRobertDelgado

94% match

Loading thumbnail…

Refactor Project zzz

This animated visualization shows the cumulative greenhouse gas emissions of the top ten ranked countries from 1990 to 2013, with each country represented by a bar chart that updates over time. The code uses D3 v4 to build the charts, with `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and includes d3-tip for tooltips and d3-legend for the legend. The animation transitions between yearly views, displaying floating labels with population and cumulative GHG data, while connecting marks and annotations track changes in country rankings.

RRobertDelgado

93% match

Loading thumbnail…

Refactor Project zzz1

This animated D3 v4 visualization displays each country's cumulative greenhouse gas emissions over time, with a focus on the top ten ranked countries. It presents a series of small bar charts, one per year, where each bar represents a country's emissions, sequentially revealing new "top" countries as they enter the ranking. The implementation uses `d3.scaleBand` and `d3.scaleLinear` for axes and employs custom `generalUpdate`, `generalEnter`, and `attributes` functions to manage SVG elements. Data is sourced from a CSV file containing country, year, GHG emissions, cumulative GHG, population, and final rank.

RRobertDelgado

92% match

Loading thumbnail…

Refactor Project xxx

A multi-year animated bar chart displays cumulative greenhouse gas emissions for the top ten ranked countries, with each bar tracking the annual addition to its total. The visualization uses D3 v4 to sort and filter CSV data by final rank, then updates the chart for each year. Code implements custom update, enter, and attribute functions for managing SVG elements, along with a d3.zoom interaction for exploring the timeline. Tooltips and floating labels provide contextual information about population and emissions values.

RRobertDelgado

91% match

Loading thumbnail…

Refactor Project zzz2

This animated D3 v4 visualization, built with BlockBuilder.org, charts greenhouse gas (GHG) emissions and cumulative emissions alongside population for 21 countries from 1990 to 2013. Each country’s data is presented in a small multiple grid, with bars for yearly emissions and paths connecting cumulative totals, animating through the years to show rank changes and growth. The rendering is driven by custom update and enter functions that manage SVG elements, while tooltips reveal specific values, and the legend and axes are styled to clarify the comparison.

RRobertDelgado

91% match

Loading thumbnail…

Project Prototype round 3 v3

This visualization plots cumulative greenhouse gas emissions from 1990 to 2013 for a ranked subset of countries, using a slider to animate through the years. Annual emissions are shown as a stacked bar segment that grows over time for each country, with the current year highlighted and each country’s cumulative total represented by the bar’s height. The chart is built with D3 v4, using `d3.scaleBand` for the categorical country axis and a linear scale for the emission values, and updates the bar heights and positions via a custom `render` function that filters the CSV data by year and rank.

RRobertDelgado

90% match

Loading thumbnail…

Refactor Project with pan & zoom

This example visualizes cumulative greenhouse gas emissions for the top ten ranked countries from 1990 to 2013, with each bar segment representing a year’s contribution. Users can pan and zoom the chart via d3.zoom, which applies a transform to the graph container, while d3-tip provides hover tooltips showing population and cumulative GHG values. The visualization uses d3.scaleBand for country categories and d3.scaleLinear for emission values, rendering the data from the provided CSV file.

RRobertDelgado

89% match