Day 21: RasterDay 10: North AmericaDay 30: My favoriteDay 8: AfricaDay 14: EuropeDay 9: HexagonsTurkey vulture migrations in South AmericaDay 3: PolygonsDay 18: AtmosphereDay 29: PopulationDay 2: LinesDay 28: Is this a chart or a mapDay 23: 3DDay 11: RetroDay 20: OutdoorsDay 16: OceaniaDay 13: ChoroplethProjection importsDay 7 - NavigationDay 4: Bad mapDay 17: FlowDay 1: Points
Day 6: Asia
Plot.plot({
projection: {
type: "mercator",
domain: {
type: "MultiPoint",
coordinates: [
[58, -15], // Northwest corner (latitude, longitude)
[151, -15], // Northeast corner (latitude, longitude)
[58, 38], // Southwest corner (latitude, longitude)
[151, 38] // Southeast corner (latitude, longitude)
]
}
},
marks: [
Plot.sphere({fill: "black"}),
Plot.geo(countries, {fill: (d)=> happiness_index_sea_2022.get(d.properties.name), opacity: 1, stroke: "white",
title: (d)=> d.properties.name + "\n" + happiness_index_sea_2022.get(d.properties.name),
//filter: d=>d.properties.name == "Singapore"
}),
Plot.geo(countries, {fill: "yellow", opacity: 1, stroke: "yellow", strokeWidth: 5,
title: (d)=> d.properties.name + "\n" + happiness_index_sea_2022.get(d.properties.name),
filter: d=>d.properties.name == "Singapore"
}),
Plot.text(['Happiness index, 2022\nSoutheast Asia'],{x:120, y: 36, fontSize: 40, fill: "yellow", opacity: 1, lineHeight: 1.6, dy: -50, fontStyle: "italic", fontWeight: "Bold" }),
Plot.text(['0 (unhappy) - 10 (happy)\n\nThe average for 2022 based on 10 countries was 5.29 points.The highest value was in Singapore: 6.59 points and the lowest value was in India: 4.04 points.'],
{x:62, y: -15, fontSize: 16, fill: "yellow", opacity: 1, lineWidth: 26, textAnchor: "start", lineHeight: 1.6, clip: false }),
Plot.text(['Data: theglobaleconomy.com | Design: Deepsha Menghani | Threads: @IandLoveandData | Mastodon: @Deepsha'],{x:150, y: -29, fontSize: 14, fill: "gray", opacity: 1, textAnchor: "end", lineHeight: 1.2, clip: false, fontStyle: "italic"}),
],
width: 700,
color: {
range: myContinuousColors, // Your custom color scheme here
interpolate: "hcl" ,
legend: true, style: {fontSize: "14px"},
width: 700
}
})
happiness_index_sea@1.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
myContinuousColors = ["black", "yellow"]
happiness_index = (await FileAttachment("happiness_index_sea@1.csv").csv()).map(d => ({name: rename.get(d.country) || d.country, Year2022: +d.Year2022}))
happiness_index_sea_2022 = new Map(happiness_index.map(({name, Year2022}) => [name, Year2022]))
import {countries} from "ff0a83b495637684"
countries
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.
