function image(date) {
return new Promise((resolve, reject) => {
const image = new Image;
image.onload = () => resolve(image);
image.onerror = () => resolve(null); // missing imagery
// image.src = `https://cdn.star.nesdis.noaa.gov/GOES17/ABI/CONUS/GEOCOLOR/${formatDate(interval(date))}_GOES17-ABI-CONUS-GEOCOLOR-${resolution}.jpg`;
image.src = createUrl(date);
});
}
function createUrl(date) {
const regionAbbr = region.split(' ')[0].toLowerCase();
const bandAbbr = band.split(' ')[0].toLowerCase();
const ts = formatDate(interval(date));
switch (regionAbbr) {
case 'fd_':
return `https://www.data.jma.go.jp/mscweb/data/himawari/img/fd_/fd__${bandAbbr}_${ts}.jpg`
default:
return `https://www.data.jma.go.jp/mscweb/data/himawari/img/${regionAbbr}/${regionAbbr}_${bandAbbr}_${ts}.jpg`;
}
}
interval = d3.utcMinute.filter(d => d.getUTCMinutes() % 10 === 0)
formatDate = d3.utcFormat("%H%M")
resolution = width * devicePixelRatio >= 1875 ? "2500x1500" : "1250x750"
d3 = require("d3-time@2", "d3-time-format@3")
import {Scrubber} from "@mbostock/scrubber"
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.
