Aubret

@Aubret·3 public vizzes

geographic

A choropleth map of France animates through 52 weeks of 2014, showing the incidence of flu cases by region. A slider lets the user scrub through time, and hovering over a region reveals its name. The visualization uses D3 v4 to load a GeoJSON of French regions and a CSV of weekly case counts, with `d3.geoConicConformal` and `d3.geoPath` drawing the map and a quantized color scale encoding case numbers.

Dec 6, 2017

Loading thumbnail…

loading multiple stock data from dataset

This example demonstrates how to load and visualize multiple stock price datasets from a CSV file, cycling through three different chart types: separate area charts for each symbol, a stacked area chart, and a streamgraph. The code uses D3 v4's `d3.text`, `d3.dsvFormat`, `d3.nest`, and `d3.stack` to parse, group, and structure the data, while `d3.scaleTime`, `d3.scaleLinear`, and `d3.area` handle the rendering as animated SVG paths. The visualization transitions automatically every 1.5 seconds, showing the shifting representation of the same monthly price data for MSFT, AMZN, IBM, and AAPL.

Nov 29, 2017

Loading thumbnail…

simple line chart from dataset

This line chart visualizes a small dataset with monthly values, displaying a black polyline and red translucent circles for each data point. The chart includes a time-based x-axis and a linear y-axis, with the last value printed in large text. The code loads data from “dataset.json” using `d3.json`, parses dates with `d3.timeParse`, and renders the chart with SVG shapes. Hovering over a circle triggers a dashed vertical line and a temporary value label, using D3’s selection and event handlers.

Nov 9, 2017