Public
Edited
Oct 8, 2024
2 forks
19 stars
Plot.plot({
projection: { type: "orthographic", rotate: [60, -40], scale: 400 },
marks: [
Plot.sphere({ fill: "#f9f9f9" }),
Plot.geo(topojson.feature(land, land.objects.land), { fill: "lightgray" }),
Plot.lineY(seasonal, {
x: "longitude",
y: "latitude",
z: "identifier",
stroke: "maxWind"
})
],
color: { legend: true },
width: Math.max(width, 640) - 12,
height: Math.floor(Math.max(width, 640) / 1.5)
})
// view.signal('ts', ts).runAsync()
seasonal
Type Table, then Shift-Enter. Ctrl-space for more options.
hurricanes = {
const hurricanes = [];
let i = 0;
while (i < lines.length) {
let [identifier, name, rows] = lines[i];
if (name === 'UNNAMED') name = '';
if (name) name = name[0] + name.slice(1).toLowerCase();
const max = { status: 'DB' };
for (let j = 1; j <= rows; j++) {
const [date, time, , status, latitude, longitude, maxWind] = lines[i + j];
const hour = Math.floor(parseInt(time) / 100);
const ts = new Date(
`${date.slice(0, 4)}-${date.slice(4, 6)}-${date.slice(6, 8)}T${
hour < 10 ? '0' + hour : hour
}:00Z`
);
if (statuses[status] > statuses[max.status]) max.status = status;
hurricanes.push({
identifier,
season: +identifier.slice(4, 8),
name,
status,
max,
ts,
latitude:
parseFloat(latitude) *
(latitude[latitude.length - 1] === 'N' ? 1 : -1),
longitude:
parseFloat(longitude) *
(longitude[longitude.length - 1] === 'E' ? 1 : -1),
maxWind: +maxWind,
last: j == rows
});
}
i += +rows + 1;
}
return hurricanes.sort((a, b) => a.ts - b.ts);
}
lines = (await FileAttachment("hurdat2-1851-2023-051124.txt").text())
.split('\n')
.map(l => l.split(',').map(s => s.trim()))
land = d3.json("https://unpkg.com/world-atlas@1/world/110m.json")
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.
