Public
Edited
Feb 15, 2023
4 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
bertin.draw({
layers: [
{
geojson: world,
tooltip: "Hello Tooltip"
},

{ type: "graticule" },
{ type: "outline" }
]
})
Insert cell
Insert cell
Insert cell
bertin.draw({
layers: [
{
geojson: world,
tooltip: "$NAME_ENGL"
},

{ type: "graticule" },
{ type: "outline" }
]
})
Insert cell
Insert cell
Insert cell
bertin.draw({
layers: [
{
geojson: world,
tooltip: ["$ISO3_CODE", "$NAME_ENGL", "source: bertin.js"]
},

{ type: "graticule" },
{ type: "outline" }
]
})
Insert cell
Insert cell
bertin.draw({
layers: [
{
geojson: world,
tooltip: [
"$NAME_ENGL",
(d) =>
"Population: " + Math.round(d.properties.pop / 1000) + " million inh."
]
},

{ type: "graticule" },
{ type: "outline" }
]
})
Insert cell
Insert cell
Insert cell
bertin.draw({
layers: [
{
geojson: world,
tooltip: {
fields: [
"$ISO3_CODE",
"- - - - - - - - - - - - - ",
"$NAME_ENGL",
"source: bertin.js"
],
fill: "#141414",
stroke: "red",
strokeWidth: 3,
fillOpacity: 0.7,
strokeOpacity: 1,
fontWeight: ["bold", "normal", "normal", "lighter"],
fontSize: [50, 14, 25, 10],
fontStyle: ["normal", "normal", "normal", "italic"],
col: ["red", "red", "red", "yellow"]
}
},

{ type: "graticule" },
{ type: "outline" }
]
})
Insert cell
Insert cell
bertin = require("bertin@latest")
Insert cell
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