100%

English

✓ Published0🌍 Public

Last edited Sep 30, 2017

Created on Sep 14, 2017

This map of the Netherlands shows population density per neighborhood (wijk) using a color scale, alongside train tracks and station locations. A Voronoi diagram highlights which station is closest to any given point. The visualization uses `d3.geoPath` and the `d3.geoAlbers` projection with zoom on click, while `d3.scaleThreshold` and `d3.schemeGnBu` define the choropleth. Hovering reveals neighborhood names, population, density, and average distance to a station. Data sources include CBS and NS, rendered as SVG with D3 v4.

AI-generated description

English

Map of the Netherland with a population density choropleth, train tracks and locations of train station. A Voronoi diagram is drawn around the train stations to show what train station is closest. Hover over an area for some extra information like name, population and avg distance to train station. Zoom by clicking on a neighbourhood.

GNU General Public License v3.0

Dutch

Kaart van Nederland met choropleth voor bevolkingsdichtheid, locaties van stations en treinsporen. Om de stations zijn Voronoi cellen getekend, zo kun je makkelijk zien welke station het dichste bij is voor een gebied. Door de muis boven een station of wijk te houden verschijnt extra informatie. Inzoomen kan door op een wijk te klikken, uitzoomen door nog eens op een wijk te klikken.

De broncode is open source onder het GNU General Public License v3.0

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Population Density Map of the Netherlands

This choropleth map visualizes population density across Dutch neighborhoods using a TopoJSON of administrative boundaries. Each polygon is filled according to its population density, with colors highlighting the spatial distribution of inhabitants per area. The view is rendered as an SVG, and an animated transition gradually reveals or recolors the map to emphasize density differences across regions. The dataset encodes each neighborhood's boundary geometry as arcs, which are transformed into a visual hierarchy of density through sequential updates, creating a clear, interactive overview of population concentration in the Netherlands.

JJulesBlm

84% match

Loading thumbnail…

Bevolkinsdichtheid Nederland

This choropleth map visualizes average income levels across Dutch neighborhoods, with the title “Bevolkingsdichtheid Nederland” (Population Density Netherlands) though the data source indicates average income. The visualization uses D3 v4 with SVG rendering to display TopoJSON geographic boundaries. Each neighborhood polygon is filled with a color gradient representing the average income, allowing viewers to quickly identify regional economic disparities across the Netherlands. The map leverages the geometry from the included TopoJSON file, which contains detailed boundary coordinates for Dutch buurten (neighborhoods), and the color encoding helps users compare income levels at a glance while maintaining geographic context through the recognizable shape of the Netherlands.

JJulesBlm

77% match

Loading thumbnail…

D3 Map Nederland

This interactive map of the Netherlands highlights individual municipalities, rendered as SVG paths and colored dark with light strokes. The visualization uses `d3.geoPath` with a Mercator projection, and `d3.zoom` enables panning and zooming. Clicking a municipality triggers a smooth transition that fills the selected region in red and zooms in on its bounds. The geographic data comes from a TopoJSON file fetched from Cartomap, and the map animates using D3 transitions.

CChubby Racoon

77% match

Loading thumbnail…

D3 Map Nederland

An interactive choropleth of the Netherlands' 2020 municipalities allows users to click any region, which highlights it in red and smoothly zooms in via a geometric zoom transform. The map renders SVG paths using d3.geoPath with a Mercator projection, while interaction relies on d3.zoom for pan/zoom transitions. Hovering turns a municipality orange. Data comes from a remote TopoJSON file of the `gemeente_2020` boundaries, styled with light gray fills and subtle black strokes.

BBrian Bawuah

76% match

Loading thumbnail…

D3 Map Nederland

This interactive map of the Netherlands shows each Dutch municipality as a clickable SVG path. Clicking a region zooms in smoothly and highlights it in red, while clicking the background resets the view. The map uses D3’s `d3.geoMercator` projection and `d3.geoPath` for geometry, with `d3.zoom` handling pan and zoom transforms. Municipal boundaries come from a TopoJSON file of the 2020 administrative divisions, rendered via topojson.feature. Hover effects change path fills to orange.

BBrian Bawuah

76% match

Loading thumbnail…

D3 Map Nederland

This example displays an interactive map of Dutch municipalities, coloring each region in light blue with black outlines and highlighting areas in solid blue on hover. The visualization loads geographic data from a TopoJSON file and renders it as SVG paths using D3 v5 with a Mercator projection. It employs d3.json to fetch the data, d3.geoPath with geoMercator for drawing shapes, and includes d3-zoom.v2 for potential panning and scaling capabilities. The hover effect is implemented through CSS, and each municipality includes a tooltip showing its name and ID.

Mmbergevoet

76% match

Loading thumbnail…

D3 Map Nederland

This interactive map of the Netherlands displays provincial boundaries, which users can click to zoom and highlight in red, with a click on the background resetting the view. Built with D3 v6 and TopoJSON, it uses `d3.geoPath` and a Mercator projection to render the shapes, while `d3.zoom` handles panning and scaling between 1x and 8x. The data loads from a remote TopoJSON file via `fetch`, and transitions animate the zoom and fill changes. Hover effects turn regions orange, and SVG elements are used for all rendering.

Llamartm

76% match

Loading thumbnail…

Gist dbbbf5036a38b2eb912d97805615c7f5

This visualization displays a single choropleth-style map of the Netherlands, showing generalized administrative regions for 2019. It uses a Mercator projection to render geographic boundaries as SVG paths. The code relies on D3.js v3, specifically `d3.geo.mercator` for projection and `d3.geo.path` to draw the shapes, while fetching GeoJSON data from the Dutch national geodata WFS service. The map is rendered on a 1200×500 pixel canvas with no additional styling or interaction.

FFrieseWoudloper

75% match