The avatar for @josephricafort
Joseph Ricafort
See the world 🌏 through data and visuals 🚀
Public
Edited
Aug 26, 2024
1 star
2
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
medalTally
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// {
// const data = medalTally.filter( d => d["medal_type"] === selectMedalType )
// const maxTally = d3.max(data, d => d["medal_count"])
// const maxYear = (year) => d3.max(data.filter(d => d["year"] === year), d => d["medal_count"])
// const maxYearGold = (year) => d3.max(medalTally
// .filter(d => d["year"] === year && d["medal_type"] === "gold"),
// d => d["medal_count"])
// return Plot.plot({
// marks: [
// Plot.cell(data, {
// x: "year",
// y: "nation",
// fill: "medal_count",
// rx: 20,
// }),
// Plot.cell(medalTally, {
// x: "year",
// y: "nation",
// fill: d => d["medal_count"] === maxYearGold(d["year"]) ? "#FFB300" : "none",
// stroke: d => d["host_nation"] === d["nation"] ? "#FF6F00" : "none",
// strokeWidth: 2,
// rx: 20,
// paintOrder: "stroke"
// }),
// Plot.text(data, {
// x: "year",
// y: "nation",
// text: "medal_count",
// fill: d => d["medal_count"] > maxTally * 0.5 ? "#333333" : "white",
// }),
// Plot.frame({ strokeOpacity: 0.25 })
// ],
// width: 1000,
// height: 350,
// color: {
// scheme: "purples",
// reverse: true
// },
// marginLeft: 100
// })
// }
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