Public
Edited
Oct 23, 2023
1 fork
27 stars
Insert cell
Insert cell
Insert cell
d3.ascending(5, 4)
Insert cell
5 > 4
Insert cell
Insert cell
d3.ascending("Alice", "Bob")
Insert cell
"Alice" < "Bob"
Insert cell
Insert cell
[3, 2, 5, 4, 1].sort(d3.ascending)
Insert cell
Insert cell
"The quick brown fox jumps over the lazy dog".split(/\s/).sort(d3.ascending)
Insert cell
Insert cell
[1, 2, 10].sort() // 🌶 Yikes!
Insert cell
Insert cell
[1, 2, 10].sort(d3.ascending)
Insert cell
Insert cell
[1, 2, 10].sort((a, b) => a - b)
Insert cell
Insert cell
Insert cell
foods = [
{item: "Soup", votes: 4, emoji: "🍜"},
{item: "Cake", votes: 5, emoji: "🍰"},
{item: "Cabbage", votes: 1, emoji: "🥬"},
{item: "Ice Cream", votes: 4, emoji: "🍦"}
]
Insert cell
sortedFoods = foods.slice().sort((a, b) => d3.descending(a.votes, b.votes))
Insert cell
Insert cell
people = [
{first: "Barry", last: "Gibb"},
{first: "Robin", last: "Gibb"},
{first: "Vince", last: "Melouney"},
{first: "Maurice", last: "Gibb"},
{first: "Colin", last: "Petersen"}
]
Insert cell
people.slice().sort((a, b) => d3.ascending(a.last, b.last) || d3.ascending(a.first, b.first))
Insert cell
Insert cell
"The quick brown fox jumps over the lazy dog".split(/\s/).sort((a, b) => d3.ascending(a.toLowerCase(), b.toLowerCase()))
Insert cell
Insert cell
Insert cell
before = new Date(2018, 0, 1)
Insert cell
after = new Date(2019, 0, 1)
Insert cell
before < after
Insert cell
d3.ascending(before, after)
Insert cell
d3.descending(before, after)
Insert cell
Insert cell
before.valueOf()
Insert cell
+before
Insert cell
+before < +after
Insert cell
Insert cell
class Color {
constructor(r, g, b) {
this.r = r & 0xff;
this.g = g & 0xff;
this.b = b & 0xff;
}
valueOf() {
return (this.r << 16) | (this.g << 8) | this.b;
}
}
Insert cell
steelblue = new Color(70, 130, 180)
Insert cell
coral = new Color(255, 127, 80)
Insert cell
steelblue < coral
Insert cell
d3.ascending(steelblue, coral)
Insert cell
Insert cell
date1 = new Date(2018, 0, 1)
Insert cell
date2 = new Date(2018, 0, 1)
Insert cell
Insert cell
date1 === date2
Insert cell
Insert cell
d3.ascending(date1, date2)
Insert cell
[date1 <= date2, date1 >= date2]
Insert cell
Insert cell
Insert cell
people.slice()
.sort((a, b) => d3.ascending(a.first, b.first))
.sort((a, b) => d3.ascending(a.last, b.last))
Insert cell
Insert cell
Insert cell
"a" < 3
Insert cell
"a" > 3
Insert cell
d3.ascending("a", 3)
Insert cell
Insert cell
"10" > 3
Insert cell
d3.ascending("10", 3)
Insert cell
Insert cell
[3, 2, "a", 4, 1].sort(d3.ascending) // 🌶 Yikes!
Insert cell
Insert cell
["100", "67", "103", "245"].sort(d3.ascending) // 🧐
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