Fork of Fork of Swedish map

100%

Fork of Fork of Swedish map

✓ Published0🌍 Public

Last edited Apr 3, 2022

Created on Apr 3, 2022

This example visualizes the counties of Sweden as a choropleth-style map, rendered in black with white interior boundaries. The map is projected using D3’s `geoMercator` and drawn with `geoPath`, fitted to a 960×500 SVG canvas within a React framework. Data comes from a TopoJSON file of Swedish county borders, loaded via `d3.json` and processed with `topojson.feature` and `topojson.mesh`. The visualization highlights administrative divisions without additional quantitative encoding, focusing on geographic shape and boundary contrast.

AI-generated description

A scatter plot of Data Canvas Sense Your City Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Swedish map

This visualization displays the counties of Sweden as a choropleth-style map, with each region filled in teal and outlined by contrasting strokes. It shows the geographic boundaries and internal subdivisions of Swedish counties, rendered as SVG paths. The code uses D3 v5’s `geoMercator` projection and `geoPath` to convert TopoJSON data into map features, while React manages the component structure. The data is sourced from a simplified Swedish counties dataset, with `topojson.feature` and `topojson.mesh` handling the geometry and internal borders.

NNikhilchiguru-8

95% match

Loading thumbnail…

Fork of Fork of Swedish map

This visualization displays the counties of Sweden as solid black regions with white interior boundaries, rendered using SVG paths generated from TopoJSON data. The map uses a Mercator projection from d3-geo, with `geoPath` and `fitExtent` to scale and position the geometry within the frame. Built with React and D3 v5, the code fetches the Swedish county dataset via `d3.json` from a GitHub Gist, then applies `feature` and `mesh` from TopoJSON to extract boundaries and shared borders. The styling, defined in CSS, gives the map a high-contrast monochrome appearance.

Ppravallikayaram12

95% match

Loading thumbnail…

Fork of Fork of Swedish map

This example displays a map of Swedish counties using a Mercator projection, rendered as black filled regions with white internal borders against a silver stroke. Built with React and D3 v5, the code leverages `d3.geoPath` for path generation and `topojson` to extract features and interior boundaries from the GeoJSON source. The visualization highlights the country’s administrative subdivisions through a minimal, high-contrast styling.

Ppravallikayaram12

94% match

Loading thumbnail…

Fork of Fork of Swedish map

This visualization displays a choropleth-style map of Swedish counties, with each county filled in aqua and outlined in red, while internal borders are rendered in teal. The map uses React to manage component state and rendering, with D3’s `geoMercator` projection and `geoPath` to generate SVG paths from TopoJSON data. The projection is fitted to the map extent using `fitExtent`, and the data is loaded from a GitHub-hosted simplified Swedish counties dataset via D3’s `json` method and TopoJSON’s `feature` and `mesh` functions.

VVineela Reddy

94% match

Loading thumbnail…

Fork of Swedish map

This visualization displays the counties of Sweden as a choropleth-style map, with each region filled in teal and internal borders highlighted in cyan. It renders county boundaries using the TopoJSON format, converted to GeoJSON features and an interior mesh. The map is projected with a Mercator projection and fitted to the viewport via `d3.geoPath`’s `fitExtent`. Built with React and D3 v5, the code loads geographic data from a remote TopoJSON source and renders the paths as SVG elements.

Nnagamaheswar

94% match

Loading thumbnail…

Fork of Fork of SwedisH MAP

This visualization displays a choropleth map of Sweden’s counties, with each county filled in brown and outlined in green, over a cyan background. The map uses the Mercator projection via `d3.geoMercator` and renders geographic paths with `d3.geoPath`. Data is loaded from a TopoJSON file fetched from a GitHub Gist, then processed with the `topojson` library's `feature` and `mesh` functions to extract county boundaries and shared interiors. The React-based interface renders the map as an SVG, with a loading message shown before data arrives.

SSRI RAM REDDY KOTERU

93% match

Loading thumbnail…

Fork of Swedish map

This visualization displays the counties of Sweden as a choropleth-style map, with each region filled in teal and boundaries highlighted in contrasting strokes. It uses a Mercator projection fitted to the geographic data, rendering the land areas and internal borders as SVG paths. The code employs React for component structure, with D3’s `geoMercator`, `geoPath`, and `fitExtent` for map projection and layout, and TopoJSON’s `feature` and `mesh` functions to parse the simplified Swedish county dataset.

NNikhilchiguru-8

93% match

Loading thumbnail…

Fork of Fork of Swedish map

This visualization displays the counties of Sweden as black filled polygons with white interior boundaries, rendered on a Mercator projection fitted to the viewport. The map is generated from TopoJSON data using `d3.geoPath` and `d3.geoMercator`, with React managing the component state through `useData` and rendering SVG marks. The code also includes a commented-out alternative using `geoEqualEarth`, and mixes styling through CSS classes that define the monochrome color scheme.

Bblikitha

93% match