Tell us what works and what could be better. We read every submission.
@adurivault·5 public vizzes
This visualization maps the weekly incidence of influenza across French regions in 2014 using a choropleth. Hovering over a region displays its name and the number of cases for that week, while a date slider or brush allows users to move through the year. The map encodes intensity through color, making it easy to see the seasonal spike in flu cases during the winter months and the geographic variation across regions. The data is sourced from a CSV file with one row per region and columns for each week, plus a yearly total. The visualization is built with D3 v4 and uses a color scale to represent case counts, with a tooltip for detail on hover.
This visualization compares monthly stock price data for several companies across multiple years. It initially renders as a stacked bar chart where each bar represents a company and is subdivided by year, using D3 v4’s stack layout and ordinal color scale. Clicking anywhere on the page triggers a smooth transition: the grouped bars slide into separate columns and reshape into individual bars showing each company’s average yearly price, animated over 800 milliseconds. The SVG-based transition highlights how the data can be viewed either as cumulative contributions or as independent annual values.
This visualization attempts to display stock prices over time using D3 v4, with data from a CSV file containing monthly price records for Microsoft (MSFT). The code sets up scales for years and stock symbols, and prepares nested data structures to compute mean prices by year and by symbol. Although the visualization is incomplete—the main rendering logic is commented out—the intended design appears to be a grouped bar chart comparing average stock prices across years and symbols. The visualization uses an ordinal color scale with a palette of purple, blue, orange, and related hues, and an SVG canvas of 960 by 500 pixels. The title "Stocks transition_1" suggests it may have been an early experiment in transitioning between different data views. The code includes commented-out sections for stacked bar layouts, indicating the author was exploring multiple chart types. The current version loads stock price data from a CSV file, parses dates into years, and prepares nested data structures for both year-then-symbol and symbol-then-year groupings, though the final rendering logic is incomplete.
This scatterplot visualizes the classic Iris dataset, mapping sepal length and width along the x- and y-axes, with petal length determining the size of each mark. Each of the three iris species (setosa, versicolor, virginica) is represented by a distinct SVG symbol generated using D3’s symbol generator, with colors from the Category20 scale. The plot includes axis labels, a legend with clickable symbols, and a tooltip. Built with D3 v4, the example demonstrates how different marks—circles, crosses, diamonds, and other geometric symbols—can encode categorical data in a scatterplot, and it shows the flexibility of D3’s ordinal scales for symbols and colors. Data is loaded from a CSV file containing the classic Iris flower measurements.
This visualization displays the classic Iris dataset as a scatter plot of sepal length versus sepal width, with each species (setosa, versicolor, virginica) encoded using distinct symbols and colors. The chart includes axes with labels, and linear regression lines are calculated and drawn for each species. Built with D3 v4, the example demonstrates how to load CSV data, define scales, render SVG symbols, and compute regression lines using the mean and sum of squared deviations.