emilienbf

@emilienbf·4 public vizzes

Fork of TP_dataviz

This interactive visualization explores the music of Metallica through two synchronized views: a radial stacked bar chart showing the top genres by song count, and a zoomable timeline plotting album releases. The radial chart uses D3’s scaleBand, scaleRadial, and arc generators, with hover and click interactions revealing songs via custom tooltips. The timeline, built with d3.scaleTime and d3.zoom, filters data from a local CSV or API fetch. D3 version 4 and 5 are loaded via CDN, with data sourced from the Wasabi API.

Dec 3, 2022

Loading thumbnail…

TD2 fork

This dashboard displays sales data from a CSV file across four SVG visualizations: a stacked bar chart of sales by sub-category and customer, a scatter plot of sales over time, a U.S. map, and a pie chart of sales by sub-category. Built with D3 v7 and Vue, it uses `d3.rollup`, `d3.stack`, `d3.scaleBand`, `d3.geoPath` with a `geoAlbersUsa` projection, and `d3.pie`/`d3.arc` for the charts. The map loads U.S. features from a remote GeoJSON URL.

Oct 10, 2022

Loading thumbnail…

Fork of MIAGE base

A bar chart ranks 234 countries by 2022 population, drawn as vertical bars using D3 v5's `scaleBand` and `scaleLinear`. A button click sorts the data ascending by population and re-renders the bars, while hovering shows a tooltip with the exact value. It loads data via `csv` from a local `data.csv` file and renders as SVG with animated transitions.

Sep 26, 2022

Loading thumbnail…

Fork of D3 Starter

This fork of D3 Starter uses SVG rendering to display a choropleth map of US counties with bubble overlays sized by population. The visualization loads TopoJSON geographic data and renders county boundaries, internal state lines, and semi-transparent red circles at each county centroid where circle radius is scaled by the square root of population using `d3.scale.sqrt`. Interactive tooltips on hover reveal county names and population values. The code uses `d3.geo.path` for geographic projection and `topojson.mesh` for state borders, with `d3.select`, `.data()`, `.enter()`, and transition methods for dynamic styling. A YouTube tutorial link is embedded in the README.

Sep 21, 2022