Web Applications Developer @ WiderFunnel | Lighthouse Labs Alumni
Published
Edited
Sep 14, 2020
2 stars
// fetch(url) returns promise, so await, then convert to json
quakes = (await fetch(url)).json()
s = 500 // canvas size
radius = (s / 2) // globe radius
viewof quakeSize = DOM.range(0,12)
setInterval(() => {
mutable rotation -= 0.25
}, 10)
// all we have is mag, lat and long -> need radius for size of earthquake (based on mag)
quakeRadius = {
// use D3's Sqrt scale -> give it starter domain and range
const scale = d3.scaleSqrt().domain([0,100]).range([0, quakeSize]) // .range([0, quakeSize]) 🔥
// return function that uses scale to compute radius size of earthquake based on quake's mag
return function(quake) {
// return the radius of the quake
return scale(Math.exp(quake.properties.mag))
}
}
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.
