Published
Edited
Feb 15, 2021
Insert cell
md`# My first exercise on Observable`
Insert cell
//require d3 v5 library
d3 = require("d3@5")
Insert cell
//require topojson-client v3 library
topojson = require("topojson-client@3")
Insert cell
//load json file
countiesIL = FileAttachment("countiesIL.json").json()
Insert cell
//extract json components
states_features = topojson.feature(countiesIL, countiesIL.objects.geojson)
Insert cell
//load particular columns and derived columns from csv file
csv_data = d3.csvParse(await FileAttachment("Simplified IL Population Data@3.csv").text(),({County, c2020, c2030}) => [County, [+c2020, (+c2030/c2020 - 1)*100]])
Insert cell
//this is how to take the values of a variable (column) from all variables you created from the csv file
//extract derived column (1), 0 start index
growth20to30 = Array.from(csv_data.values(), d => d[1][1])
Insert cell
//this is how you map the id column to the values. We will use this for joining with topojson later.
data = Object.assign(new Map(csv_data), {title: ["County", "growth20to30"]})
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