Tell us what works and what could be better. We read every submission.
@aaronmunoz·7 public vizzes
This example shows a dual-panel line chart of global climate temperature anomalies from five datasets (GISS, HAD, NOAA, RSS, UAH) over time. The top panel displays the full time series, while the bottom panel contains a smaller overview of the same data. A brush selection on the bottom panel controls the zoom level of the top panel, redrawing it to show only the selected time range. The visualization is rendered with SVG using D3 v3, and the brush interaction demonstrates a practical technique for exploring dense time-series data.
This visualization displays monthly global temperature anomaly data from five climate datasets—GISS, HAD, NOAA, RSS, and UAH—as multiple overlaid line series across time. The main chart shows the full time range, while a smaller focus chart beneath it displays the same data with a brushed window. Users can drag or resize the brush on the bottom chart to zoom the top chart into a specific time period, which updates the visible range of the line plot accordingly. The technique demonstrates linked brushing between two views of the same dataset, with the top chart redrawn to match the selected extent.
This block displays a static map of United States counties rendered as SVG paths, colored a uniform light gray with subtle borders. The map uses the Albers USA projection and draws county boundaries from a 20m Census shapefile. While the visualization itself has no data-driven coloring, it is built as a "ready for chloropleth" template: hovering over any county reveals a tooltip with the county name and state, populated by cross-referencing state and county FIPS codes. The example demonstrates how to set up county-level geographic data, apply a projection, and implement interactive mouseover tooltips, providing a foundation for mapping quantitative data onto U.S. counties.
This choropleth displays all U.S. counties in a light gray with subtle borders, using an AlbersUSA projection. When the user hovers over a county, a tooltip appears showing the county name and its state, assembled from FIPS codes via nested lookup tables. County boundary geometry comes from a 20m Census shapefile, rendered as SVG paths with D3 v3.
This example shows a simple scatterplot of seven data points, each defined by an x and y coordinate, plotted on a 960-by-500 SVG canvas. The code uses D3 v4 to append an SVG element to the body, but it does not yet render the circles or axes, leaving the visualization incomplete. The data is hardcoded as an array of objects, and the rendering approach relies on SVG, with the page layout fixed via CSS. The example demonstrates the initial setup for a scatterplot using D3’s selection and attribute methods.
This visualization is a choropleth map of the United States showing chlamydia rates by county, colored on a blue scale from light to dark based on the rate value. The map is rendered in SVG using d3.v4, with county boundaries drawn and each county filled according to its associated rate from the chlamydia.csv dataset. Counties with missing data appear blank. The visualization uses a sequential color scale to represent the range of rates across the country, with darker shades indicating higher rates. The map displays data for all U.S. counties and includes Alaska and Hawaii insets. The visualization was created with Blockbuilder.org and uses an MIT license.
A choropleth map of the United States displays county-level unemployment rates. Each county is filled with a color from a sequential blue scale, mapping rates between 2% and 10% using `d3.scaleThreshold`. The map is rendered as SVG, with county boundaries drawn via `d3.geoPath` and state outlines as white lines. Data for each county is joined from a TSV file containing unemployment rates, and a horizontal color legend with tick marks shows the rate scale.