Skip to main content
SimilarExport ZIP
100%

DataViz of Freight Transport around Europe

✓ Published0🌍 Public
NNpfn
Last edited Jan 2, 2018
Created on Jan 2, 2018

An animated, tile-based map visualizes freight transport volumes among European countries from 2010 onward. The visualization toggles between a traditional geographic projection and a grid layout where each nation becomes a rectangle. It renders country boundaries from GeoJSON data and animates transitions between the two modes. The project uses D3.js v4 for SVG rendering and animations, along with the geo2rect library to compute the rectangular tile positions, and loads trade data from a JSON file.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

Europe geo to square tiles animation with geo2rect

This example animates a geographic map of Europe into a square tile grid, using the geo2rect library to morph each country’s polygon into a rectangle positioned at a custom grid location. The visualization loads Natural Earth-derived GeoJSON, simplifies multipolygons and holes, and uses D3 v4 with SVG paths and a Mercator projection. Clicking the toggle button switches between the original geo layout and the tiled arrangement, with a 2000-millisecond transition animating the transformation. The grid positions are manually defined in a configuration object, and the code relies on geo2rect’s internal computation of closest corner points to map each shape.

NNpfn
74% match
Loading thumbnail…

TestProjEurope

This interactive map of Europe, built with D3 v4, visualizes geographic data for the continent. The visualization uses a custom GeoJSON file to render country boundaries, with vector shapes drawn onto an SVG canvas. The map is constructed using D3's geographic path generator, allowing for smooth zooming and panning interactions. The project appears to be a test or demonstration of mapping capabilities, with the focus on displaying the geometry of European countries in a clean, minimal style.

HHectorDt
73% match
Loading thumbnail…

Europe_test

This map shows the countries of Europe as solid dark-gray polygons on a white background. The data comes from a GeoJSON file named `custom.geo.json`, which contains the administrative boundaries. The visualization uses the D3.js v4 library, employing `d3.geoConicConformal()` for the map projection and `d3.geoPath()` to render each country's path. The map is centered on coordinates 10, 46 and rendered as SVG within a fixed 700 by 580 viewport.

LLaippe
72% match
Loading thumbnail…

Europe_test2

This visualization shows a map of Europe with overlaid data points representing altitude measurements across the continent. It uses a conic conformal projection via `d3.geoConicConformal` and `d3.geoPath` to render country boundaries from a GeoJSON file, while circles plotted from a CSV dataset are colored on a quantile scale based on altitude values. An interactive range slider controls altitude filtering, and a button resets the view, with zoom support provided by `d3.zoom`. Hovering reveals country names through a tooltip.

LLaippe
70% match
Loading thumbnail…

Europe_flight

This map of Europe uses a conic conformal projection to render world landmasses and country boundaries, drawn with d3.geoPath from TopoJSON data. A red circle is manually positioned, while a graticule layer provided by d3.geoGraticule10 adds a reference grid. The visualization uses D3 v4 and SVG to display the geographic context.

LLaippe
70% match
Loading thumbnail…

Baltic Container Traffic

The visualization displays 2013 container traffic volumes for Baltic Sea countries, sorted in descending order using horizontal bar lengths scaled proportionally to TEU values. Hovering over each bar reveals the country’s exact traffic figure via a title tooltip. The page uses D3 v3 to load CSV data, sort entries, and append SVG rectangles, while the static header and legend are hand-coded SVG polygons and text elements. Data comes from the provided `balticcontainers2.csv` file, with the bar width formula dividing each value by 100,000 and multiplying by 1.33 to fit the chart area.

HHermanniB
70% match
Loading thumbnail…

Fork of ICE-8.2 - Europe Countries

This visualization displays a choropleth-style map of European countries rendered on an SVG element. It uses a D3 Mercator projection centered on Europe, with each country drawn as a path with a yellow fill and black borders against a blue background. The code loads GeoJSON data from a GitHub gist via `d3.json`, then generates the map using `d3.geoPath` and the topojson library. The example is built with D3 v5 in a React framework.

PPeter S
70% match
Loading thumbnail…

testProjet

This visualization displays a choropleth map of European countries colored by their motor vehicle statistics over time. The code loads geographic boundaries from `eurotopo.json` and motor vehicle data from `type_of_motor_cars.csv`, then uses `d3.geo.conicConformalEurope` projection with `d3.geo.path` to render the map. The interface includes a tooltip for displaying values, suggesting interactive exploration of population and vehicle counts across different European regions and years.

MMarineRu
70% match