Skip to main content
SimilarExport ZIP
100%

fresh block

✓ Published0🌍 Public
NNicocolabricot
Last edited Feb 2, 2018
Created on Feb 2, 2018

This example displays a map of a French region, likely a department or territory, as a set of gray polygon outlines. It uses D3.js v4 to load a GeoJSON file named "regions.json" and render its features onto an SVG canvas. The code relies on the `d3.geoAlbersUsa()` projection and `d3.geoPath()` to convert the geographic coordinates into SVG paths, which are then appended to the visualization.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

fresh block

This example displays a map of a French region, likely a department or territory, as a set of gray polygon outlines. It uses D3.js v4 to load a GeoJSON file named "regions.json" and render its features onto an SVG canvas. The code relies on the `d3.geoAlbersUsa()` projection and `d3.geoPath()` to convert the geographic coordinates into SVG paths, which are then appended to the visualization.

NNicocolabricot
100% match
Loading thumbnail…

fresh block

This example displays a map of a French region, likely a department or territory, as a set of gray polygon outlines. It uses D3.js v4 to load a GeoJSON file named "regions.json" and render its features onto an SVG canvas. The code relies on the `d3.geoAlbersUsa()` projection and `d3.geoPath()` to convert the geographic coordinates into SVG paths, which are then appended to the visualization.

NNicocolabricot
100% match
Loading thumbnail…

fresh block

This example displays a map of a French region, likely a department or territory, as a set of gray polygon outlines. It uses D3.js v4 to load a GeoJSON file named "regions.json" and render its features onto an SVG canvas. The code relies on the `d3.geoAlbersUsa()` projection and `d3.geoPath()` to convert the geographic coordinates into SVG paths, which are then appended to the visualization.

NNicocolabricot
100% match
Loading thumbnail…

fresh block

A map of world regions renders as a choropleth using a Mercator projection, with each country or territory filled by a distinct categorical color. The visualization loads a TopoJSON file and converts it to GeoJSON with the `topojson.feature` API, then fits the projection to the data using `projection.fitSize`. D3 v5’s `d3.geoPath` generates the SVG paths, while `d3.scaleOrdinal` with `d3.schemeCategory10` assigns unique colors to each feature.

GGerardoFurtado
82% match
Loading thumbnail…

fresh block

This example displays a static world map rendered as gray SVG paths, with each country drawn as a separate geographic feature. The visualization loads GeoJSON data from a local `countries.json` file and uses `d3.geoPath()` to project the coordinates onto a 500×500 pixel canvas. The code applies a uniform gray fill to every country, with no interactivity or styling variations. It relies on D3 v5’s selection and data-join methods (`svg.selectAll("path").data(data.features)`) to create the map elements from the GeoJSON structure.

PPrakhar1998
80% match
Loading thumbnail…

Gist cf47ed32426b88863d607d9d0dccb77d

This example shows a single outlined region of France rendered as a black-and-white map using the D3.js library. It uses the `d3.geo.path()` API with a conic conformal projection to transform GeoJSON polygon coordinates into SVG paths. The visualization loads its geographic data from a local `regions_geo.json` file and draws the shape on a fixed-size SVG canvas.

MMarineRu
80% match
Loading thumbnail…

fresh block

This example displays a set of geographic shapes from a JSON file on a Mercator projection. It uses D3 v5 to construct an SVG and render polygons with a `d3.geoPath`, projecting them with a `d3.geoMercator` centered on Australia. The code filters the raw data for entries with a `shape` field, parses them with `topojson`, and applies a teal fill with a dark slate stroke.

GGerardoFurtado
79% match
Loading thumbnail…

fresh block

This example displays administrative districts of Côte d'Ivoire as red-outlined SVG paths on a gray fill, rendered via a Mercator projection. The code loads GeoJSON topology from a local file using d3.json and converts it to GeoJSON features with topojson.feature, then draws each district with d3.geoPath. District boundaries are separated using topojson.mesh, and hover interactions are prepared through a tooltip div, though no click or color-change behavior is active in the visible code. The visualization relies on D3 v5 and topojson.v2.

SSamagoue
79% match