Public
Edited
Sep 13, 2023
3 stars
Insert cell
Insert cell
Insert cell
Insert cell
athletesBySport = d3.flatGroup(athletes, (d) => d.name)
Insert cell
Insert cell
athletesByNationSport = d3.group(athletes, d => d.nation, d => d.sport)
Insert cell
Insert cell
athletesByNationSport.get("United States").get("Boxing")
Insert cell
Insert cell
d3.group(athletes, d => d.name[0])
Insert cell
Insert cell
d3.groups(athletes, d => d.name)
Insert cell
d3.groups(athletes, d => d.name, d => d.sport)
Insert cell
Insert cell
transactions = [
{name: "Jim", amount: 3400, date: new Date("2015-11-12")},
{name: "Carl", amount: 12011, date: new Date("2015-11-12")},
{name: "Carl", amount: 2391, date: new Date("2015-11-12")},
{name: "Stacy", amount: 3405, date: new Date("2015-10-09")},
{name: "Stacy", amount: 1201, date: new Date("2016-01-04")}
]
Insert cell
Insert cell
d3.group(transactions, d => d.date) // 👍 Dates can be equal!
Insert cell
Insert cell
d3.rollup(athletes, v => v.length, d => d.sport)
Insert cell
Insert cell
d3.rollup(athletes, v => d3.sum(v, d => d.earnings), d => d.sport)
Insert cell
Insert cell
d3.least(d3.rollup(athletes, v => d3.sum(v, d => d.earnings), d => d.sport), ([, sum]) => -sum)
Insert cell
Insert cell
d3.least(d3.group(athletes, d => d.sport), ([, v]) => -d3.sum(v, d => d.earnings))
Insert cell
Insert cell
d3.rollup(athletes, v => v.length, d => d.nation, d => d.sport)
Insert cell
Insert cell
d3.rollups(athletes, v => d3.sum(v, d => d.earnings), d => d.sport)
Insert cell
Insert cell
Insert cell
index = d3.index(athletes, d => d.name)
Insert cell
Insert cell
facts = [
{about: "Neymar", fact: "Neymar is Neymar da Silva Santos Júnior"},
{about: "Roger Federer", fact: "Federer has won 20 Grand Slam men's singles titles"},
{about: "Megan Rapinoe", fact: "Rapinoe was named The Best FIFA Women's Player in 2019"}
]
Insert cell
Insert cell
facts.map(({about: name, fact}) => ({fact, name, ...index.get(name)}))
Insert cell
Insert cell
{
const index = d3.index(facts, d => d.about);
return athletes.map(({name, ...values}) => ({name, fact: index.get(name)?.fact}))
}
Insert cell
{
const index = d3.index(facts, d => d.about);
return athletes.map(({name, ...values}) => ({name, fact: index.get(name)?.fact, ...values}))
}
Insert cell
Insert cell
d3.index(athletes, d => d.nation)
Insert cell
Insert cell
nn = d3.index(athletes, d => d.nation, d => d.sport, d => d.name)
Insert cell
nn.get("United States")?.get("Basketball")
Insert cell
nn.get("United States")?.get("Basketball")?.get("LeBron James")
Insert cell
nn.get("United States")?.get("Soccer")?.get("Rapinoe")
Insert cell
Insert cell
d3.indexes(athletes, d => d.nation, d => d.name)
Insert cell
Insert cell
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