The avatar for @observablehq
Observable
The end-to-end solution for building and hosting better data apps, dashboards, and reports.
Published
Video series: Learning Observable
Edited
Sep 22, 2021
Fork of Anjana's World Earthquake Map
•
11 forks
51 stars
Video series: Learning Observable
Notebooks & Cells
Reactive Markdown & HTMLReactive DataflowUser Input & InteractivityJavaScript and ObservableImports & Remixing CellsGetting Data into a NotebookSharing, Publishing & Embedding
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
urls = ({
"past-day": "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojson",
"past-week": "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_week.geojson",
"past-month": "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_month.geojson"
})
Insert cell
Insert cell
quakes = (await fetch(urls[timeFrame])).json()
Insert cell
Insert cell
quakeCircles = {
const circle = d3.geoCircle();
return quakes.features.map(quake => {
return circle.center(quake.geometry.coordinates).radius(magnitudeRadius(quake) / 5).precision(25)();
});
}
Insert cell
Insert cell
world = (await fetch("https://unpkg.com/world-atlas@1/world/110m.json")).json()
Insert cell
Insert cell
earth = topojson.feature(world, world.objects[land])
Insert cell
Insert cell
magnitudeRadius = {
const scale = d3.scaleSqrt().domain([0, 100]).range([0, quakeSize]);
return function(quake) {
return scale((Math.exp(quake.properties.mag)));
}
}
Insert cell
Insert cell
exampleQuakeData = quakes.features[30].properties
Insert cell
exampleQuakeMagnitude = magnitudeRadius({properties: exampleQuakeData})
Insert cell
Insert cell
w = Math.min(680, width)
Insert cell
Insert cell
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