a =7
a
c = { var b =11; // local var to this cell
return a+b
}
c
// the => mapping operator is a shorthand syntactical way to define a function
f = x => x +1
// bring in D3 to use its functions; d3@6 means version 6. Defaults to the most recent
d3 = require("d3")
data.columns
data.length
d3.max(data, r => r.IncomePerCapita)
data [ d3.maxIndex(data, r => r.IncomePerCapita) ]
//get the population column
data.map(r => r.Population)
// make a data set with a new column (on top of a copy of all others) where the PopDelta is the change in population:
data2 = data.map (r => ( { ...r, PopDelta: r.Population - r.Pop2000 } ) )
data2.filter( r => r.Name < "B")
[...data2].sort( (a,b) => b.IncomePerCapita - a.IncomePerCapita)
d3.group(data2, r => r.Name[0])
// Since we are in a functional programming syntax, we can group by other more complex functions in the Binning function with the mapping operator like: into bins of 10000 dollars
g1 = d3.group(data2, r => Math.floor(r.IncomePerCapita / 10000) )
//Here an example of the Rollup function of D3: it is like grouping, but it also collapses - or aggregates - each group into one roll. So we might want to specify an aggregation function (here the mean population) AND a binning function IncomePerCapita that gives some derived value for the group :
ag1 = d3.rollup( data2, g => d3.mean(g, r => r.Population), r => Math.floor(r.IncomePerCapita / 10000) )
ag2 = d3.rollup( data2, g => d3.mean(g, r => r.Population), r => r.Name[0] )
// here is a rollup for mean grads in alphabetical bins
Array.from(d3.rollup(data, g => d3.mean(g, r=>r.PercentCollegeGrad), r => r.Name[0] ))
.map( r => ({Name: r[0], MeanCollegeGrads: r[1]}) )
import {table}from "@tmcw/tables"
table(data2)
// inspecting we have our derived value
coli = data2.map(r => r.PopDelta)
// lets grab the incomes to chart
incomes = data2.map( r => r.IncomePerCapita)
// try a pre-built histogram , over-riding the local values with your own rolled up or grouped data ; @d3/histogram
import {chart as histo} with {incomes as data} from "@d3/histogram"
histo
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.
