100%

Fork of complexity thesis

✓ Published0🌍 Public

Last edited Feb 28, 2025

Created on Feb 28, 2025

This choropleth map displays digital complexity across European NUTS2 regions, with darker blues indicating higher normalized complexity values and a legend mapping thresholds from 20 to 100. Using D3.js v6 and the Eurostat Map library’s `map()` builder, it applies a sequential color scale with `d3.interpolateYlGnBu` to CSV data from a GitHub gist. The map supports hover tooltips, responsive resizing that adjusts legend placement, and an SVG download feature via XML serialization.

AI-generated description

Digital Complexity Map of Europe

This project displays a choropleth map of Digital Complexity across European regions using the Eurostat Map library and D3.js.

Features

Interactive map showing Digital Complexity across NUTS2 regions in Europe
Color-coded visualization with a clear legend
Responsive design that adapts to different screen sizes
Download functionality to export the map as SVG

Technology Stack

HTML5 for structure
CSS3 for styling
JavaScript for interactivity
D3.js for data visualization
Eurostat Map library for European maps

Usage

Open the HTML file in a web browser
Interact with the map to view different regions
Hover over regions to see specific values
Use the "Download SVG" button to save the map

Data Source

The visualization uses normalized complexity data from: https://gist.githubusercontent.com/stefanachi/aedfef961b5860daa45544a788d2bc27/raw/7258f371a652b32a5c15bd1653a9790a91ed98e3/Complexity.csv

Responsive Design

The map automatically adjusts its layout based on screen size:

Desktop: Full legend and insets
Mobile: Compact legend and optimized for smaller screens

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of complexity thesis

NNita

100% match

Loading thumbnail…

Fork of Digital Complexity-Full

This fork of Digital Complexity-Full uses the Eurostat Map framework to render a choropleth map of European NUTS2 regions, colored by a normalized "Complexity" indicator from a CSV file hosted on GitHub. It visualizes the data using threshold classification with breaks at 20, 40, 60, 80, and 100, and includes a legend, tooltips, and country insets for larger screens. The SVG output is generated via JavaScript, and the page includes a button that serializes the map to an SVG file for download, leveraging the `eurostat-map` API and the `XMLSerializer`.

SStefan Apostol

88% match

Loading thumbnail…

Fork of Fork of Productivity-Complexity thesis

This example displays a bivariate choropleth map of European NUTS2 regions, visualizing the relationship between digital complexity and productivity. The map uses a custom color scale with eight classes, blending `d3.interpolatePuBuGn` for one variable and `d3.interpolateRdYlBu` for the other, with thresholds applied to categorize data. It is rendered as an SVG using the `eurostat-map` library, which loads CSV data from a GitHub gist. The visualization includes an interactive legend and a download button that serializes the SVG to a file via `XMLSerializer`.

SStefan Apostol

87% match

Loading thumbnail…

complexity thesis

This interactive choropleth map displays digital complexity across Swiss NUTS2 regions using threshold-based classification. Built with the `eurostat-map` React library and rendered as SVG, it visualizes normalized complexity values from a CSV file, with a "DIGITAL COMPLEXITY" legend. The map includes insets for larger screens and a download button that serializes the SVG to a file via `XMLSerializer`, while responsive settings adjust legend and tooltip sizes for smaller devices.

SStefan Apostol

86% match

Loading thumbnail…

Fork of Productivity-Complexity

This visualization displays a bivariate choropleth map of European NUTS2 regions, comparing digital complexity and productivity values. The map uses the eurostat-map library to render SVG regions, with each variable loaded from a CSV file via the `stat()` API. A custom `d3.scaleSequential` with the `interpolatePuBuGn` color scheme defines the bivariate color legend, while `d3.scale-chromatic` and `d3-interpolate` support palette generation. The map includes an interactive legend and a download button that serializes the SVG using `XMLSerializer`.

SStefan Apostol

84% match

Loading thumbnail…

TRY COMPLEX

This map of Switzerland displays the normalized "Digital Complexity" across NUTS-2 regions, using a color gradient from the d3-scale-chromatic `d3.interpolatePlasma` scale. The eurostat-map library generates the SVG, with a threshold classification method and custom legend. The code also includes a button to download the rendered SVG, and the visualization adapts its layout and tooltip settings for smaller screens using responsive JavaScript conditions. The data is loaded from a CSV file stored on GitHub.

SStefan Apostol

80% match

Loading thumbnail…

Fork of Reldens

This example visualizes Relatedness Density across Swiss NUTS2 regions using a choropleth map. It employs the eurostat-map library to render the geographic boundaries as SVG, with a sequential color scale created via d3.scaleSequential and d3.interpolateYlGnBu to encode data values. The map uses threshold-based classification with specific cutoffs, and includes a legend and tooltips. The visualization also provides a button to download the rendered SVG, and adapts its layout and legend position based on viewport width.

SStefan Apostol

73% match

Loading thumbnail…

Fork of Card D3

This interactive map visualization displays European countries with colored circles marking each nation's location. The circles are color-coded by musical genre preference, with a legend explaining the color scheme. Users can zoom and pan the map, and hovering over a circle reveals a tooltip showing the country name and its associated music genre. The visualization uses D3.js v6 with geoMercator and geoPath for the map projection, SVG circles for data points, and d3-scaleOrdinal for color assignment based on the countriesEuropean.json dataset.

PPLD3508A

71% match