MelanieJulien

@MelanieJulien·7 public vizzes

Module 3 exercice

This visualization displays greenhouse gas emissions per capita for OECD countries from 1990 to 2012, highlighting that Luxembourg, Canada, Australia, and the United States are the largest emitters. The chart uses d3.v3 with SVG rendering and loads data from a CSV file via `d3.csv`. Each country’s emissions are drawn as a line path using `d3.svg.line()`, with time-based x-scale (`d3.time.scale`) and linear y-scale. Hovering over a circle highlights it, while the axes are generated with `d3.svg.axis`.

Apr 25, 2015

Loading thumbnail…

Module 3 exercice

A scatterplot displays each country's greenhouse gas emissions per capita against total emissions for 2012, using data from the OECD. Circles representing countries are sorted by total emissions and animate in from the left edge before settling into position. Built with D3 version 3, the visualization uses `d3.svg.axis` for the axes and a `transition` to animate the circles' horizontal position, with tooltips on hover showing the country and its precise values.

Apr 19, 2015

Loading thumbnail…

Module 3 exercice

Twenty-one years of greenhouse gas emissions per capita across 30 countries are compared, with 1990 values plotted against 2012 values. The animated scatterplot shows each country as a circle that grows and changes color as it sorts, revealing shifts in national emissions rankings over time. The visualization uses D3 version 3 with SVG rendering and transition animations, loading data from an OECD-sourced CSV file. Circle positions derive from a linear scale mapping both axes in kilograms of GHG emissions.

Apr 19, 2015

Loading thumbnail…

Module 3 exercice

This visualization ranks OECD countries by their 2012 greenhouse gas emissions per capita using a horizontal bar chart, with Australia and the United States among the highest emitters and Turkey the lowest. The chart is built with D3 v3 and renders as SVG, using `d3.scale.linear` for the x-axis, `d3.scale.ordinal` with `rangeRoundBands` for the y-axis, and `d3.svg.axis` for tick labels. Data comes from a CSV file (melaniejuliendata.csv) sourced from OECD statistics, and hovering over a bar reveals a tooltip with the exact emissions value.

Apr 6, 2015

Loading thumbnail…

Module 3 exercice

This example displays a horizontal bar chart of per-capita greenhouse gas emissions for 32 countries in 2012, sorted in descending order. Each bar’s width is proportional to the value in the `GHGin2012` column from a CSV file. Hovering over a bar reveals a tooltip with the country name and exact emissions figure via an appended `title` element. The visualization uses D3 v3’s `d3.csv` and `d3.descending` to load and sort data, rendering rects and text within an SVG canvas.

Apr 3, 2015

Loading thumbnail…

Module 2 exercice

This example shows a static SVG composition that features a purple background, two grey axes, a violet circle, a violet square, and a smaller violet circle, alongside the text "Take a look at this!!". The visualization loads a CSV dataset using `d3.csv` to log the data to the console, but the chart itself does not plot the data. The scene is rendered using raw SVG elements (line, circle, rect, text) defined directly in the markup, with styling applied via CSS. The D3 library is included only to fetch and parse the external CSV file.

Apr 3, 2015

Loading thumbnail…

Greenhouse gas emissions

The visualization tracks per-capita greenhouse gas emissions from 1990 to 2012 for 30 countries, revealing diverging national trends and relative rankings over time. The chart uses d3.forceSimulation to compute a stable time-series layout, then animates year-by-year transitions with transition.attrTween, while a color legend and country labels clarify the data. Rendering relies on D3’s SVG path generators, with the dataset sourced from a gist by MelanieJulien and parsed directly from CSV.

Mar 18, 2015