Public
Edited
Jul 22, 2023
Fork of Untitled
Insert cell
Insert cell
map = {
const width = 700,
height = 550;

const path = d3.geoPath();

const projection = d3.geoMercator().fitExtent(
[
[0, 0],
[width, height]
],
depts_geojson
);

path.projection(projection);

const svg = d3
.create("svg")
.attr("id", "svg")
.attr("viewBox", [0, 0, width, height])
// .attr("width", width)
// .attr("height", height)
.attr("class", "Blues");

const deps = svg.append("g");

var features = deps
.selectAll("path")
.data(depts_geojson.features)
.enter()
.append("path")
.attr("id", (d) => "d" + d.properties.code)
.attr("d", path);
return svg.node();
}
Insert cell
depts_geojson = FileAttachment("departements.geojson").json()
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more