Sync from GitHub 33dc1e2

README.md

@@ -30,11 +30,21 @@ panel: dataset
   -> app.js:        MapLibre globe; cursor shows the cell and whether it has a sample
 click a cell -> its footprint rows (page index) -> the image file on Hugging Face (one row group per sample)
   -> samples.js: that row group's thumbnail column -> panel, with acquisition time, cloud cover or orbit, product
-the shown image: Open (full window, zoom and pan) or Show on map (over its footprint, opacity slider): every image
+the shown image: Enlarge (full window, zoom and pan) and always on the map over its footprint, opaque: every image
   is 10,680 m square in its UTM zone, centred on the sample's centre_lat, centre_lon, so corners need no band read
 View menu: the stored thumbnail (default), composites (S2: true colour, false colour, SWIR, one stretch for the three
   bands; S1: VV, VH, VV/VH in dB; DEM: elevation in colour) and every band (grey, 2-98% stretch, value under the
   cursor in the full window) -> bands.js: the band columns (LZW GeoTIFFs) of the sample's row group, geotiff.js
+VIIRS Nighttime Light (viirs.js): no thumbnail column; footprints/VIIRS.parquet gives each tile's zip shard, offset and
+  size -> one range request -> the GeoTIFF (zstd: decoder added to geotiff.js, fzstd) -> radiance in inferno, log
+  0.1-100 nW/cm²/sr (the Core Viewer's scale) -> panel and map, corners from the GeoTIFF's bounds; no downloads
+AlphaEarth Embeddings (aef.js): footprints/AEF.parquet maps each Core-S2L2A cell to the 81.9 km COG tiles under its
+  window, footprints/AEF-tiles.parquet each tile to its file per year (tge-labs/aef on source.coop; one button per year,
+  the cell's Sentinel-2 year first) -> PCA of the 64 bands in two steps: the whole 160 m level in one request (~10 MB)
+  -> preview (~4.5 s), an exact PCA at 160 m; the 8 bands that best predict the components, at 10 m -> a PCA
+  proxy at 10 m (~15 s). A cell's window is joined from every tile it touches (24.6% need two to four). The COGs are
+  stored south-up: origin and row direction from each file. View menu: single bands at 10 m. Downloads: the shown
+  image (.png), the shown band or all 64 at 10 m (GeoTIFF written in the browser), Python (rasterio.merge)
 Downloads (download.js): the shown band as stored (.tif); every band, the thumbnail and metadata.json (.zip); a
   Python snippet that reads the same row group from Hugging Face
 in the background: the other datasets' footprints once the first is drawn; after a click, the same cell's samples
@@ -54,7 +64,7 @@ in the background: the other datasets' footprints once the first is drawn; after
 | `parquet.js` | range requests for hyparquet, with bytes and time counted; each file's footer read once |
 | `tiles.js`, `labels.js`, `places.json` | copied from the Climate Globe: cells and tiles, place names |
 | `build_index.py` | Core `metadata.parquet` -> `footprints/<name>.parquet` and `footprints/datasets.json` |
-| `footprints/` | built files, not in git: uploaded to the Space once (S2L2A and S2L1C 32.9 MB each, S1RTC 20.6 MB, DEM 14.5 MB) |
+| `footprints/` | built files, not in git: uploaded to the Space once (S2L2A and S2L1C 32.9 MB each, S1RTC 20.6 MB, DEM 14.5 MB, VIIRS 21.5 MB, AEF 14.3 MB, AEF-tiles 1.8 MB) |
 
 ## Reads
 

aef.js

@@ -0,0 +1,374 @@
+// AlphaEarth embeddings (tge-labs/aef on source.coop): a cell's window of its yearly COG tiles, shown as a PCA of the
+// 64 bands (fast: a coarse PCA first, then the high-res image from a few bands), or one band.
+//
+//   footprint row (tile_row, tile_rows: lists, one entry per tile under the cell's 10,680 m window, its own first)
+//     -> footprints/AEF-tiles.parquet, each tile's rows (page index) -> the year's COGs
+//   each tile gives the part of the window it covers; the parts are joined (a zone's tiles share one 81,920 m grid,
+//   a whole number of pixels at every level, so they fit exactly); 24.6% of cells need more than one tile
+//   PCA, in two steps (each source.coop request waits ~0.7 s and few run at once, so requests set the time):
+//     1. preview: each tile's whole 160 m level, all 64 bands in one request (~10 MB; the level's tiles are stored
+//        together) -> the window (67 px) -> PCA (three leading components) -> shown at once (onPreview)
+//        the level is kept: other cells of the same tile and year skip this read
+//     2. high-res: the 8 bands that best predict the three components (forward selection, least squares on the
+//        160 m pixels; R² 0.95-0.98 against the full 64-band PCA, measured at 40 m for three places) -> those bands at
+//        10 m (geotiff.js, only the tiles under the window) -> the fitted mapping -> 1,068 px
+//   geotiff.js reads in 1 MB blocks: the COG's headers (one per level) in one request, a band's adjacent tiles in one
+//   one band: that band at 10 m, grey, 2-98% stretch; downloads: the joined window's bands at 10 m (download.js)
+//   The COGs are stored south-up (row 0 at the tile's southern edge): the origin and the row direction come from
+//   each file's own transform, and rows are flipped so north is up.
+//   Pixels no tile covers (a zone edge, the coast) and no-data (-128) are transparent. PCA colours are the cell's
+//   own: the same colour means similar embeddings within a cell, not across cells.
+
+import { fromCustomClient, getDecoder } from 'https://cdn.jsdelivr.net/npm/geotiff@2.1.3/+esm'
+import proj4 from 'https://cdn.jsdelivr.net/npm/proj4@2.12.1/+esm'
+import { compressors, newStats, openFile, parquetRead } from './parquet.js'
+import './zstd.js'
+
+const HALF = 5340, NODATA = -128, FIT = 50_000, OVERVIEW = 4, HIGH = 0, CHOSEN = 8    // levels: 4 = 160 m, 0 = 10 m
+
+/** The views offered: the PCA (default), then single bands. */
+export function aefViews() {
+  return [{ id: 'pca', label: 'PCA proxy of 64 bands, 10 m' },            // the 160 m PCA, predicted from 8 bands
+    ...Array.from({ length: 64 }, (_, b) => ({ id: `band:${b}`, label: `Band A${String(b).padStart(2, '0')}, 10 m` }))]
+}
+
+/** A geotiff.js client that counts what it reads into `stats`. */
+function countingClient(url, stats) {
+  return {
+    async request({ headers, signal } = {}) {
+      const r = await fetch(url, { headers, signal }), data = await r.arrayBuffer()
+      stats.bytes += data.byteLength; stats.requests += 1
+      return { ok: r.ok, status: r.status, getHeader: name => r.headers.get(name), getData: async () => data }
+    },
+  }
+}
+
+/** One tile's rows (one per year): {year, epsg, west, north, path}. */
+async function tileRows(info, start, count, stats) {
+  const url = new URL(`footprints/${info.tiles}`, location.href).href.split('?')[0] + location.search
+  const { file, metadata } = await openFile(url, stats)
+  let rows = []
+  await parquetRead({ file, metadata, compressors, useOffsetIndex: true, rowStart: start, rowEnd: start + count,
+    rowFormat: 'object', onComplete(r) { rows = r } })
+  return rows
+}
+
+const listOf = v => (Array.isArray(v) || ArrayBuffer.isView(v) ? [...v].map(Number) : [Number(v)])
+
+/** The cell in its UTM zone, and its tiles' files in the sample's year: {epsg, cx, cy, corners, urls}. */
+export async function aefCell(info, sample, stats = newStats()) {
+  const starts = listOf(sample.tile_row), counts = listOf(sample.tile_rows)
+  const rows = await Promise.all(starts.map((s, k) => tileRows(info, s, counts[k], stats)))
+  const tiles = rows.map(r => r.find(x => Number(x.year) === sample.year)).filter(Boolean)
+  if (!tiles.length) throw new Error(`no AlphaEarth tile for ${sample.year}`)
+  const epsg = Number(tiles[0].epsg)
+  const utm = proj4(`+proj=utm +zone=${epsg % 100}${epsg > 32700 ? ' +south' : ''} +datum=WGS84 +units=m +no_defs`)
+  const [cx, cy] = utm.forward([sample.centre_lon, sample.centre_lat])
+  const corners = [[cx - HALF, cy + HALF], [cx + HALF, cy + HALF], [cx + HALF, cy - HALF], [cx - HALF, cy - HALF]]
+    .map(q => utm.inverse(q))
+  return { epsg, cx, cy, corners, urls: tiles.map(x => `${info.files}${x.path}`) }
+}
+
+const opened = new Map()                       // COG url -> {tiff, left, top, dy}
+
+/** A COG, opened once (its headers in one 1 MB block), with its origin and row direction. */
+function openCog(url, stats) {
+  if (!opened.has(url)) {
+    opened.set(url, (async () => {
+      const tiff = await fromCustomClient(countingClient(url, stats), { blockSize: 2 ** 20 })
+      const [, , , left, , dy, , top] = (await tiff.getImage(0)).fileDirectory.ModelTransformation   // dy > 0: south-up
+      return { url, tiff, left, top, dy }
+    })().catch(e => { opened.delete(url); throw e }))
+  }
+  return opened.get(url)
+}
+
+/** Every tile's part of the window, joined: one Int8Array per band (NODATA where no tile covers). */
+function join(parts, size) {
+  return parts[0].map((first, b) => {
+    const out = Int8Array.from(first)
+    for (const part of parts.slice(1)) {
+      const band = part[b]
+      for (let i = 0; i < out.length; i++) if (out[i] === NODATA) out[i] = band[i]
+    }
+    return out
+  })
+}
+
+/** Bands of the cell's window at one level, read from every tile and joined: {bands, size, west, north, res}. */
+export async function aefWindow(info, sample, level, samples, stats = newStats()) {
+  const cell = await aefCell(info, sample, stats), cogs = await Promise.all(cell.urls.map(u => openCog(u, stats)))
+  const k = 2 ** level, size = Math.round(2 * HALF / (10 * k)), res = 10 * k
+  const parts = await Promise.all(cogs.map(async c => {
+    const image = await c.tiff.getImage(level), w = windowAt(c.left, c.top, c.dy, level, cell.cx, cell.cy)
+    return readWindow(image, w, samples, stats, c.dy > 0)
+  }))
+  const w = windowAt(cogs[0].left, cogs[0].top, cogs[0].dy, level, cell.cx, cell.cy)
+  return { bands: join(parts.filter(Boolean), size), size, res, west: w.west, north: w.north, cell }
+}
+
+/** One view of the cell's window in the sample's year: {src, size, values (one band: for the cursor), corners, stats}.
+ *  For the PCA, onPreview(view) gets the 160 m image as soon as it is drawn. */
+export async function renderAef(info, sample, viewId, stats = newStats(), onPreview = () => {}) {
+  const cell = await aefCell(info, sample, stats)
+  const done = async (rgba, size, values = null) => {
+    const src = await png(rgba, size)
+    stats.read = performance.now() - stats.t0
+    return { src, size, values, corners: cell.corners, stats }
+  }
+
+  if (viewId.startsWith('band:')) {
+    const window = await aefWindow(info, sample, 0, [Number(viewId.split(':')[1])], stats), { bands: [band], size } = window
+    const values = { width: size, values: Float32Array.from(band, v => (v === NODATA ? NaN : v)), unit: '' }
+    return { ...(await done(greyRgba(band, size), size, values)), window }            // window: for the band's GeoTIFF
+  }
+
+  stats.phase = 'Overview, 160 m'
+  const cogs = await Promise.all(cell.urls.map(u => openCog(u, stats)))
+  const size8 = Math.round(2 * HALF / (10 * 2 ** OVERVIEW))
+  const coarse = join(await Promise.all(cogs.map(async c => {
+    const overview = await overviewOf(c, stats), w = windowAt(c.left, c.top, c.dy, OVERVIEW, cell.cx, cell.cy)
+    return overview.bands.map(band => cut(band, overview.width, overview.height, w, c.dy > 0))
+  })), size8)
+  const pca = fitPca(coarse, size8)
+  if (!pca) return done(new Uint8ClampedArray(size8 * size8 * 4), size8)
+  onPreview({ ...(await done(rgbOf(pca.scores, pca.valid, size8), size8)), label: 'PCA of 64 bands, 160 m' })
+
+  stats.phase = `Loading high-res: ${CHOSEN} bands at 10 m`
+  const { chosen, weights } = selectBands(coarse, pca, CHOSEN)
+  const { bands: fine, size } = await aefWindow(info, sample, HIGH, chosen, stats)
+  const n = size * size, valid = [], scores = [0, 1, 2].map(() => new Float32Array(n))
+  for (let i = 0; i < n; i++) {
+    if (fine[0][i] === NODATA) continue
+    valid.push(i)
+    for (let k = 0; k < 3; k++) {
+      let s = weights[chosen.length][k]                                        // intercept
+      for (let j = 0; j < chosen.length; j++) s += fine[j][i] * weights[j][k]
+      scores[k][i] = s
+    }
+  }
+  return done(rgbOf(scores, valid, size), size)
+}
+
+/** The cell's window on one level: its size, its position in that level's pixels (rows counted as stored), and its
+ *  west and north edges in metres. */
+function windowAt(left, top, dy, level, cx, cy) {
+  const k = 2 ** level, res = 10 * k, size = Math.round(2 * HALF / res)
+  const x0 = Math.round((cx - HALF - left) / res)
+  const y0 = Math.round(Math.min((cy + HALF - top) / (dy * k), (cy - HALF - top) / (dy * k)))
+  const yEdges = [top + y0 * dy * k, top + (y0 + size) * dy * k]
+  return { level, size, x0, y0, west: left + x0 * res, north: Math.max(...yEdges) }
+}
+
+const overviews = new Map()                    // COG url -> its 160 m level, all bands (six kept: ~16 MB each)
+
+/** The preview level of a COG (160 m), every band, from one request over the level's tiles (stored together), kept. */
+function overviewOf({ url, tiff }, stats) {
+  if (!overviews.has(url)) {
+    overviews.set(url, (async () => {
+      const image = await tiff.getImage(OVERVIEW), fd = image.fileDirectory, offsets = fd.TileOffsets, counts = fd.TileByteCounts
+      const start = Math.min(...offsets), end = Math.max(...offsets.map((o, i) => o + counts[i]))
+      stats.expected = Math.max(stats.expected ?? 0, stats.bytes) + (end - start)
+      const r = await fetch(url, { headers: { Range: `bytes=${start}-${end - 1}` } })
+      if (r.status !== 206) throw new Error(`AlphaEarth overview: HTTP ${r.status}`)
+      const data = await r.arrayBuffer()
+      stats.bytes += data.byteLength; stats.requests += 1
+      const decoder = await getDecoder(fd), W = image.getWidth(), H = image.getHeight(), T = fd.TileWidth
+      const across = Math.ceil(W / T), down = Math.ceil(H / fd.TileLength), per = across * down
+      const bands = []
+      for (let b = 0; b < image.getSamplesPerPixel(); b++) {
+        const band = new Int8Array(W * H)
+        for (let r = 0; r < down; r++) {
+          for (let q = 0; q < across; q++) {
+            const t = b * per + r * across + q
+            const raw = new Int8Array(await decoder.decode(fd, data.slice(offsets[t] - start, offsets[t] - start + counts[t])))
+            for (let y = 0; y < T && r * T + y < H; y++) {
+              const w = Math.min(T, W - q * T)
+              band.set(raw.subarray(y * T, y * T + w), (r * T + y) * W + q * T)
+            }
+          }
+        }
+        bands.push(band)
+      }
+      if (overviews.size > 6) overviews.delete(overviews.keys().next().value)
+      return { width: W, height: H, bands }
+    })().catch(e => { overviews.delete(url); throw e }))
+  }
+  return overviews.get(url)
+}
+
+/** The window's pixels of some bands in one COG, read through geotiff.js (only the tiles under it), north up;
+ *  null when the COG holds none of the window. */
+async function readWindow(image, w, samples, stats, flip) {
+  const W = image.getWidth(), H = image.getHeight()
+  const box = [Math.max(w.x0, 0), Math.max(w.y0, 0), Math.min(w.x0 + w.size, W), Math.min(w.y0 + w.size, H)]
+  if (box[2] <= box[0] || box[3] <= box[1]) return null                 // this tile holds none of the window
+  stats.expected = Math.max(stats.expected ?? 0, stats.bytes) + expectedBytes(image, box, samples)
+  const parts = await image.readRasters({ window: box, samples, interleave: false })
+  return parts.map(part => place(part, box, w, flip))
+}
+
+/** Compressed bytes of the tiles under the window, for the bands read (planar COG: tiles band by band). */
+function expectedBytes(image, [a, b, c, d], samples) {
+  const fd = image.fileDirectory, T = fd.TileWidth, across = Math.ceil(image.getWidth() / T)
+  const per = across * Math.ceil(image.getHeight() / fd.TileLength)
+  let sum = 0
+  for (const s of samples) {
+    for (let r = Math.floor(b / T); r <= Math.floor((d - 1) / T); r++) {
+      for (let q = Math.floor(a / T); q <= Math.floor((c - 1) / T); q++) sum += fd.TileByteCounts[s * per + r * across + q]
+    }
+  }
+  return sum
+}
+
+/** A read box (part of the window inside the image) placed into the full window, north up, NODATA elsewhere. */
+function place(part, [a, b, c, d], w, flip) {
+  const out = new Int8Array(w.size * w.size).fill(NODATA), width = c - a
+  for (let y = b; y < d; y++) {
+    const row = flip ? w.size - 1 - (y - w.y0) : y - w.y0
+    out.set(part.subarray((y - b) * width, (y - b + 1) * width), row * w.size + (a - w.x0))
+  }
+  return out
+}
+
+/** The window cut from a whole level held in memory. */
+function cut(band, W, H, w, flip) {
+  const box = [Math.max(w.x0, 0), Math.max(w.y0, 0), Math.min(w.x0 + w.size, W), Math.min(w.y0 + w.size, H)]
+  const width = box[2] - box[0], part = new Int8Array(Math.max(width, 0) * Math.max(box[3] - box[1], 0))
+  for (let y = box[1]; y < box[3]; y++) part.set(band.subarray(y * W + box[0], y * W + box[2]), (y - box[1]) * width)
+  return place(part, box, w, flip)
+}
+
+/** PCA of the window's bands: {mean, components (3 x 64), scores (3 arrays), valid (pixel indices), fit (indices)}. */
+function fitPca(bands, size) {
+  const n = size * size, B = bands.length, valid = []
+  for (let i = 0; i < n; i++) if (bands[0][i] !== NODATA) valid.push(i)
+  if (valid.length < 2) return null
+  const step = Math.max(1, Math.floor(valid.length / FIT)), fit = valid.filter((_, k) => k % step === 0)
+  const mean = new Float64Array(B), cov = new Float64Array(B * B), x = new Float64Array(B)
+  for (const i of fit) for (let b = 0; b < B; b++) mean[b] += bands[b][i] / fit.length
+  for (const i of fit) {
+    for (let b = 0; b < B; b++) x[b] = bands[b][i] - mean[b]
+    for (let b = 0; b < B; b++) for (let c = b; c < B; c++) cov[b * B + c] += x[b] * x[c]
+  }
+  for (let b = 0; b < B; b++) for (let c = 0; c < b; c++) cov[b * B + c] = cov[c * B + b]
+  const components = leading(cov, B, 3), scores = components.map(() => new Float32Array(n))
+  for (const i of valid) {
+    for (let k = 0; k < 3; k++) {
+      let s = 0
+      for (let b = 0; b < B; b++) s += (bands[b][i] - mean[b]) * components[k][b]
+      scores[k][i] = s
+    }
+  }
+  return { mean, components, scores, valid, fit }
+}
+
+/** The `count` bands that best predict the three components (forward selection on R², least squares with an
+ *  intercept, from the normal equations), and the weights: rows per chosen band, then the intercept; 3 columns. */
+function selectBands(bands, pca, count) {
+  const B = bands.length, I = B, pixels = pca.fit, Y = pca.scores
+  const G = new Float64Array((B + 1) * (B + 1)), XY = Array.from({ length: B + 1 }, () => new Float64Array(3))
+  const value = (b, i) => (b === I ? 1 : bands[b][i])
+  for (const i of pixels) {
+    for (let b = 0; b <= B; b++) {
+      const vb = value(b, i)
+      for (let c = b; c <= B; c++) G[b * (B + 1) + c] += vb * value(c, i)
+      for (let k = 0; k < 3; k++) XY[b][k] += vb * Y[k][i]
+    }
+  }
+  for (let b = 0; b <= B; b++) for (let c = 0; c < b; c++) G[b * (B + 1) + c] = G[c * (B + 1) + b]
+  const explained = set => {                         // sum over components of the fitted values' sum of squares
+    const w = solve(set.map(b => set.map(c => G[b * (B + 1) + c])), set.map(b => [...XY[b]]))
+    if (!w) return [-Infinity, null]
+    let s = 0
+    for (let j = 0; j < set.length; j++) for (let k = 0; k < 3; k++) s += w[j][k] * XY[set[j]][k]
+    return [s, w]
+  }
+  const chosen = []
+  for (let step = 0; step < count; step++) {
+    let best = -1, bestScore = -Infinity
+    for (let b = 0; b < B; b++) {
+      if (chosen.includes(b)) continue
+      const [s] = explained([...chosen, b, I])
+      if (s > bestScore) { bestScore = s; best = b }
+    }
+    chosen.push(best)
+  }
+  return { chosen, weights: explained([...chosen, I])[1] }
+}
+
+/** Solves A W = R (A: m x m, R: m x 3) by Gaussian elimination with partial pivoting; null if singular. */
+function solve(A, R) {
+  const m = A.length, a = A.map((row, i) => [...row, ...R[i]])
+  for (let c = 0; c < m; c++) {
+    let p = c
+    for (let r = c + 1; r < m; r++) if (Math.abs(a[r][c]) > Math.abs(a[p][c])) p = r
+    if (Math.abs(a[p][c]) < 1e-9) return null
+    ;[a[c], a[p]] = [a[p], a[c]]
+    for (let r = 0; r < m; r++) {
+      if (r === c) continue
+      const f = a[r][c] / a[c][c]
+      for (let k = c; k < m + 3; k++) a[r][k] -= f * a[c][k]
+    }
+  }
+  return a.map((row, i) => row.slice(m).map(v => v / a[i][i]))
+}
+
+/** 2nd and 98th percentile of a sample of values. */
+function range(values) {
+  const v = Float64Array.from(values).sort()
+  if (!v.length) return [0, 1]
+  const lo = v[Math.floor(v.length * 0.02)], hi = v[Math.floor(v.length * 0.98)]
+  return hi > lo ? [lo, hi] : [lo, lo + 1]
+}
+
+/** Three component images as RGB, each stretched 2-98% over a sample of the valid pixels; the rest transparent. */
+function rgbOf(scores, valid, size) {
+  const out = new Uint8ClampedArray(size * size * 4), step = Math.max(1, Math.floor(valid.length / FIT))
+  const ranges = scores.map(s => range(valid.filter((_, k) => k % step === 0).map(i => s[i])))
+  for (const i of valid) {
+    for (let k = 0; k < 3; k++) out[i * 4 + k] = 255 * Math.min(Math.max((scores[k][i] - ranges[k][0]) / (ranges[k][1] - ranges[k][0]), 0), 1)
+    out[i * 4 + 3] = 255
+  }
+  return out
+}
+
+function greyRgba(band, size) {
+  const out = new Uint8ClampedArray(size * size * 4), picked = []
+  for (let i = 0; i < band.length; i += Math.max(1, Math.floor(band.length / FIT))) if (band[i] !== NODATA) picked.push(band[i])
+  const [lo, hi] = range(picked)
+  for (let i = 0; i < band.length; i++) {
+    if (band[i] === NODATA) continue
+    const g = 255 * Math.min(Math.max((band[i] - lo) / (hi - lo), 0), 1)
+    out[i * 4] = g; out[i * 4 + 1] = g; out[i * 4 + 2] = g; out[i * 4 + 3] = 255
+  }
+  return out
+}
+
+async function png(rgba, size) {
+  const canvas = new OffscreenCanvas(size, size)
+  canvas.getContext('2d').putImageData(new ImageData(rgba, size, size), 0, 0)
+  return URL.createObjectURL(await canvas.convertToBlob({ type: 'image/png' }))
+}
+
+/** The `count` leading eigenvectors of a symmetric B x B matrix: power iteration, deflating after each. Signs are
+ *  fixed (largest loading positive) so the same data gives the same colours. */
+function leading(cov, B, count) {
+  const m = Float64Array.from(cov), out = []
+  for (let k = 0; k < count; k++) {
+    let v = Float64Array.from({ length: B }, (_, b) => 1 + b / B), lambda = 0
+    for (let it = 0; it < 200; it++) {
+      const w = new Float64Array(B)
+      for (let b = 0; b < B; b++) { let s = 0; for (let c = 0; c < B; c++) s += m[b * B + c] * v[c]; w[b] = s }
+      const norm = Math.hypot(...w)
+      if (!norm) break
+      lambda = norm; v = w.map(e => e / norm)
+    }
+    let big = 0
+    for (let b = 1; b < B; b++) if (Math.abs(v[b]) > Math.abs(v[big])) big = b
+    if (v[big] < 0) v = v.map(e => -e)
+    for (let b = 0; b < B; b++) for (let c = 0; c < B; c++) m[b * B + c] -= lambda * v[b] * v[c]
+    out.push(v)
+  }
+  return out
+}

app.js

@@ -2,11 +2,14 @@
 //
 //   dataset (panel) -> footprints/<name>.parquet, two position columns (footprints.js) -> mask on the cell array
 //     -> coverage tiles drawn in the browser (tiles.js) -> globe
+//   datasets with a kind have no thumbnail column: VIIRS tiles are read and coloured (viirs.js); AlphaEarth windows
+//     are read from the yearly COG and shown as a PCA of the 64 bands (aef.js), one choice button per year
 //   click -> cell -> its samples (footprint rows, page index) -> image file on Hugging Face, one row group,
 //     thumbnail column (samples.js) -> panel
 //   cursor -> cell under it -> outline + name, position, whether it has a sample
 //   the shown image (the stored thumbnail, or a band or composite decoded from the image file, bands.js)
-//     -> full window (zoom, pan, value under the cursor) or on the map over its footprint (corners from its UTM centre)
+//     -> full window (zoom, pan, value under the cursor) and on the map over its footprint (corners from its UTM centre)
+//   the sample's acquisition -> Core-Weather on source.coop, ±24 h and ±30 d (weather.js) -> charts in the panel
 //     -> downloads of the bands as stored (download.js)
 
 import * as maplibregl from 'https://cdn.jsdelivr.net/npm/maplibre-gl@6.14.0/dist/maplibre-gl.mjs'
@@ -17,11 +20,15 @@ import { placeLabels } from './labels.js'
 import { imageUrl, loadThumbnail } from './samples.js'
 import { bandNames, render, views } from './bands.js'
 import { newStats } from './parquet.js'
-import { downloadAll, downloadBand, pythonSnippet } from './download.js'
+import { loadWeather, weatherRows } from './weather.js'
+import { loadViirs } from './viirs.js'
+import { aefCell, aefViews, aefWindow, renderAef } from './aef.js'
+import { aefSnippet, downloadAefTiff, downloadAll, downloadBand, downloadImage, downloadViirs, pythonSnippet, viirsSnippet }
+  from './download.js'
 import { cellAt, cellIndex, renderTile } from './tiles.js'
 
 const $ = id => document.getElementById(id)
-const COLOURS = { S2L2A: [57, 181, 74], S2L1C: [0, 113, 188], S1RTC: [241, 90, 36], DEM: [180, 140, 90] }
+const COLOURS = { S2L2A: [57, 181, 74], S2L1C: [0, 113, 188], S1RTC: [241, 90, 36], DEM: [180, 140, 90], VIIRS: [126, 87, 194], AEF: [32, 150, 150] }
 
 const state = { name: null, info: null, datasets: null, coverage: null, version: 0, loading: 0 }
 
@@ -42,7 +49,7 @@ maplibregl.addProtocol('mt', async params => {
 })
 
 const map = new maplibregl.Map({
-  container: 'map', center: [12, 22], zoom: innerWidth < 820 ? 1.3 : 2.25, attributionControl: false, maxZoom: 12,
+  container: 'map', center: [12, 22], zoom: innerWidth < 820 ? 1.3 : 2.25, attributionControl: false, maxZoom: 13,
   style: {
     version: 8, projection: { type: 'globe' },
     sky: { 'atmosphere-blend': ['interpolate', ['linear'], ['zoom'], 0, 0.6, 4, 0.3, 7, 0] },
@@ -204,8 +211,9 @@ async function setDataset(name, datasets) {
   const ticket = ++state.loading, info = datasets[name]
   state.name = name; state.info = info; state.coverage = null
   document.querySelector(`input[name=dataset][value="${name}"]`).checked = true
-  $('dataset-link').href = `https://huggingface.co/datasets/Major-TOM/Core-${name}`
-  $('dataset-link').textContent = `huggingface.co/datasets/Major-TOM/Core-${name}`
+  const link = info.link ?? `https://huggingface.co/datasets/Major-TOM/Core-${name}`
+  $('dataset-link').href = link
+  $('dataset-link').textContent = link.replace('https://', '')
   $('status').textContent = ''
   startLoader(`${info.label} · footprints of ${info.samples.toLocaleString('en')} samples`)
   let coverage
@@ -250,20 +258,39 @@ const thumbs = new Map()                                  // "<dataset>/<part>/<
 
 function samplesOf(name, row, col) {
   const key = `${name}/${row}/${col}`
-  if (!lookups.has(key)) lookups.set(key, samplesAt(name, row, col).catch(e => { lookups.delete(key); throw e }))
+  if (!lookups.has(key)) lookups.set(key, samplesAt(name, row, col).then(rows => byYear(name, rows)).catch(e => { lookups.delete(key); throw e }))
   return lookups.get(key)
 }
+
+/** AlphaEarth: the cell's one footprint row as one sample per year (cellYear: its Sentinel-2 year, the default). */
+function byYear(name, rows) {
+  const info = state.datasets[name]
+  if (info.kind !== 'aef' || !rows.length) return rows
+  const [first, last] = info.years
+  return Array.from({ length: last - first + 1 }, (_, k) => ({ ...rows[0], year: first + k, cellYear: rows[0].year }))
+}
+
+/** A sample's key, unique within its dataset. */
+const sampleKey = s => (s.part !== undefined ? `${s.part}/${s.parquet_row}` : s.shard ? `${s.shard}/${s.offset}`
+  : `${s.grid_row_u}/${s.grid_col_r}/${s.year}`)
+
+/** The first image of a sample, read once: [promise, fresh, stats]. Thumbnail (Core), tile (VIIRS) or PCA (AlphaEarth). */
 function thumbnailOf(name, sample) {
-  const key = `${name}/${sample.part}/${sample.parquet_row}`, fresh = !thumbs.has(key)
-  if (fresh) thumbs.set(key, loadThumbnail(state.datasets[name], sample).catch(e => { thumbs.delete(key); throw e }))
-  return [thumbs.get(key), fresh]
+  const info = state.datasets[name], key = `${name}/${sampleKey(sample)}`, fresh = !thumbs.has(key)
+  if (fresh) {
+    const stats = newStats()
+    const load = info.kind === 'viirs' ? loadViirs(info, sample, stats) : info.kind === 'aef' ? renderAef(info, sample, 'pca', stats, view => stats.onPreview?.(view))
+      : loadThumbnail(info, sample)
+    thumbs.set(key, { promise: load.catch(e => { thumbs.delete(key); throw e }), stats })
+  }
+  return [thumbs.get(key).promise, fresh, thumbs.get(key).stats]
 }
 
 /** The selected cell in every other dataset, in the panel's order, after the shown one. */
 async function prefetchCell(cell) {
   for (const name of Object.keys(state.datasets)) {
     if (pick.cell !== cell) return                         // another cell was picked
-    if (name === state.name) continue
+    if (name === state.name || state.datasets[name].kind === 'aef') continue   // AlphaEarth: tens of MB, only on request
     try {
       const samples = await samplesOf(name, cell.row, cell.col)
       if (samples.length) await thumbnailOf(name, samples[0])[0]
@@ -294,7 +321,7 @@ async function pickCell() {
   const ticket = ++pick.ticket, { row, col } = pick.cell, name = state.name
   pick.samples = []; pick.thumbnail = null; pick.shown = null; pick.viewTicket++
   showThumbnail(null, 'Looking up the cell…'); showOnMap()
-  $('choices').replaceChildren(); $('pick-meta').replaceChildren(); $('pick-stats').textContent = ''
+  $('choices').replaceChildren(); $('pick-meta').replaceChildren(); $('pick-stats').textContent = ''; $('weather').hidden = true
   let samples
   try {
     samples = await samplesOf(name, row, col)
@@ -308,12 +335,12 @@ async function pickCell() {
   if (samples.length > 1) {
     $('choices').replaceChildren(...samples.map((s, i) => {
       const b = document.createElement('button')
-      b.textContent = s.timestamp ? when(s.timestamp) : `sample ${i + 1}`
+      b.textContent = s.timestamp ? when(s.timestamp) : s.year ? String(s.year) : `sample ${i + 1}`
       b.addEventListener('click', () => choose(i))
       return b
     }))
   }
-  choose(0)
+  choose(Math.max(0, samples.findIndex(s => s.cellYear !== undefined && s.year === s.cellYear)))
 }
 
 async function choose(i) {
@@ -321,17 +348,33 @@ async function choose(i) {
   pick.chosen = i; pick.shown = null; pick.bands = []; pick.views = []; pick.viewTicket++
   for (const [k, b] of [...$('choices').children].entries()) b.setAttribute('aria-pressed', String(k === i))
   meta(sample, null, info)
-  showThumbnail(null, 'Loading the thumbnail…')
+  showWeather(sample, ticket)
+  showThumbnail(null, info.kind === 'aef' ? 'Reading the 64 bands…' : 'Loading the thumbnail…')
   try {
-    const [loading, fresh] = thumbnailOf(state.name, sample), t = await loading
+    const [loading, fresh, stats] = thumbnailOf(state.name, sample)
+    const stop = fresh && info.kind === 'aef' ? followLoad(`AlphaEarth ${sample.year} · ${pick.cell.name} · 64 bands`, stats) : () => {}
+    let unbadge = () => {}
+    stats.onPreview = view => {                                        // AlphaEarth: the 160 m PCA while 10 m loads
+      stop()
+      if (ticket !== pick.ticket) return
+      pick.shown = { ...view, sample: { ...sample, corners: view.corners } }
+      showThumbnail(view.src); showOnMap()
+      unbadge = loadingBadge('Loading high-res (10 m)', stats)
+      $('pick-stats').textContent = `${view.label} · loading high-res (10 m)…`
+    }
+    const t = await loading.finally(() => { stop(); unbadge() })
     if (ticket !== pick.ticket) return
-    pick.thumbnail = { ...t, sample }
-    pick.shown = { src: t.src, values: null, sample, label: 'Thumbnail' }
+    const label = { viirs: 'Radiance', aef: aefViews()[0].label }[info.kind] ?? 'Thumbnail'
+    const placed = t.corners ? { ...sample, corners: t.corners } : sample
+    pick.thumbnail = { ...t, sample: placed }
+    pick.shown = { src: t.src, values: t.values ?? null, size: t.size, sample: placed, label }
     showThumbnail(t.src)
     showOnMap()
     meta(sample, t.productId, info)
-    buildViews(name, info, sample, ticket)
-    $('pick-stats').textContent = `Thumbnail: ${kb(t.stats.bytes)} in ${reqs(t.stats.requests)} · ${secs(t.stats.read)}` +
+    if (info.kind === 'aef') aefMenu(label)
+    else if (info.kind) updateDownloads()                               // no band menu: the tile is one band
+    else buildViews(name, info, sample, ticket)
+    $('pick-stats').textContent = `${label}: ${kb(t.stats.bytes)} in ${reqs(t.stats.requests)} · ${secs(t.stats.read)}` +
       (fresh ? '' : ' (loaded before)')
     prefetchCell(pick.cell)
   } catch (error) {
@@ -339,7 +382,21 @@ async function choose(i) {
   }
 }
 
+/** The badge over a preview while its high-res version loads: the share of its bytes so far. Returns the function
+ *  that ends it. */
+function loadingBadge(text, stats) {
+  const base = stats.bytes, badge = $('thumb-badge')
+  const update = () => {
+    const share = stats.expected > base ? Math.min(99, Math.round(100 * (stats.bytes - base) / (stats.expected - base))) : 0
+    $('thumb-badge-text').textContent = `${text} · ${share}%`
+  }
+  update(); badge.hidden = false
+  const timer = setInterval(update, 150)
+  return () => { clearInterval(timer); badge.hidden = true }
+}
+
 function showThumbnail(src, note = '') {
+  $('thumb-badge').hidden = true                                        // a new image: no high-res load under way for it
   $('thumb').hidden = !src
   $('image-actions').hidden = !src
   $('download-actions').hidden = !src
@@ -356,28 +413,54 @@ const HALF = 5340
 
 /** Corners of a sample's image, [lon, lat], from top left clockwise (as MapLibre's image source wants them). */
 function corners(s) {
+  if (s.corners) return s.corners                                      // VIIRS: from the GeoTIFF's own bounds
   const zone = s.epsg % 100, south = s.epsg > 32700
   const utm = proj4(`+proj=utm +zone=${zone}${south ? ' +south' : ''} +datum=WGS84 +units=m +no_defs`)
   const [x, y] = utm.forward([s.centre_lon, s.centre_lat])
   return [[x - HALF, y + HALF], [x + HALF, y + HALF], [x + HALF, y - HALF], [x - HALF, y - HALF]].map(p => utm.inverse(p))
 }
 
-/** The shown image over its footprint when "Show on map" is ticked; otherwise none. */
+/** The shown image over its footprint, opaque, while a cell is selected. */
 function showOnMap() {
-  const t = pick.shown, on = $('on-map').checked && t && pick.cell
+  const t = pick.shown, on = t && pick.cell
   if (map.getLayer('sample')) map.removeLayer('sample')
   if (map.getSource('sample')) map.removeSource('sample')
   if (!on) return
   map.addSource('sample', { type: 'image', url: t.src, coordinates: corners(t.sample) })
   map.addLayer({ id: 'sample', type: 'raster', source: 'sample',
-    paint: { 'raster-opacity': Number($('opacity').value) / 100, 'raster-fade-duration': 0 } }, 'coast')
+    paint: { 'raster-opacity': 1, 'raster-fade-duration': 0 } }, 'coast')
 }
-$('on-map').addEventListener('change', showOnMap)
-$('opacity').addEventListener('input', () => {
-  if (map.getLayer('sample')) map.setPaintProperty('sample', 'raster-opacity', Number($('opacity').value) / 100)
-})
 window.sampleCorners = () => (pick.shown ? corners(pick.shown.sample) : null)             // for automated checks
 
+// ---- Core-Weather at the acquisition --------------------------------------------------------------------------
+
+const WEATHER_DATASETS = ['S2L2A', 'S2L1C', 'S1RTC']                   // Core-Weather has rows for these three
+
+/** The sample's hourly and daily weather in the panel. Datasets without an acquisition time of their own (DEM, VIIRS
+ *  annual medians) show the weather at the cell's Sentinel-2 L2A acquisition, and say so. */
+async function showWeather(sample, ticket) {
+  let at = sample, from = ''
+  if (!(sample.timestamp && WEATHER_DATASETS.includes(state.name))) {
+    const s2 = await samplesOf('S2L2A', pick.cell.row, pick.cell.col).catch(() => [])
+    if (ticket !== pick.ticket) return
+    at = s2[0]; from = at?.timestamp ? `At the cell's Sentinel-2 L2A acquisition, ${when(at.timestamp)}` : ''
+  }
+  $('weather').hidden = !at?.timestamp
+  if ($('weather').hidden) return
+  $('wx-from').textContent = from; $('wx-from').hidden = !from
+  $('wx-hourly').replaceChildren(); $('wx-daily').replaceChildren(); $('wx-stats').textContent = 'Loading Core-Weather…'
+  try {
+    const w = await loadWeather(pick.cell.name, at.timestamp)
+    if (ticket !== pick.ticket) return
+    $('wx-hourly').replaceChildren(...weatherRows(w.hourly, 'hourly'))
+    $('wx-daily').replaceChildren(...weatherRows(w.daily, 'daily'))
+    $('wx-stats').textContent = (w.hourly || w.daily ? '' : 'No Core-Weather row for this acquisition · ') +
+      `Core-Weather: ${kb(w.stats.bytes)} in ${reqs(w.stats.requests)} · ${secs(w.stats.read)}`
+  } catch (error) {
+    if (ticket === pick.ticket) $('wx-stats').textContent = `Could not load Core-Weather: ${error.message}`
+  }
+}
+
 // ---- views: the stored thumbnail, composites and single bands ------------------------------------------------
 //   the menu lists the image file's band columns; a chosen view is decoded once and kept (renders)
 
@@ -394,16 +477,30 @@ async function buildViews(name, info, sample, ticket) {
   } catch { /* no menu: the thumbnail stays */ }
 }
 
+/** AlphaEarth's View menu: the PCA shown, then each band at 10 m. */
+function aefMenu(label) {
+  pick.views = aefViews().slice(1)
+  $('view').replaceChildren(new Option(label, 'thumbnail'), ...pick.views.map(v => new Option(v.label, v.id)))
+  $('view').value = 'thumbnail'; $('view-row').hidden = false
+  updateDownloads()
+}
+
 $('view').addEventListener('change', () => showView($('view').value))
 
 async function showView(id) {
   const t = pick.thumbnail, ticket = ++pick.viewTicket
   if (!t) return
-  if (id === 'thumbnail') { pick.shown = { src: t.src, values: null, sample: t.sample, label: 'Thumbnail' }; refreshShown(); return }
-  const view = pick.views.find(v => v.id === id), key = `${state.name}/${t.sample.part}/${t.sample.parquet_row}/${id}`
+  if (id === 'thumbnail') {
+    pick.shown = { src: t.src, values: t.values ?? null, size: t.size, sample: t.sample, label: $('view').options[0].text }
+    refreshShown(); return
+  }
+  const view = pick.views.find(v => v.id === id), key = `${state.name}/${sampleKey(t.sample)}/${id}`
   $('pick-stats').textContent = `Loading ${view.label}…`
   const fresh = !renders.has(key), stats = newStats()
-  if (fresh) renders.set(key, render(state.info, t.sample, view, stats).catch(e => { renders.delete(key); throw e }))
+  if (fresh) {
+    const job = state.info.kind === 'aef' ? renderAef(state.info, t.sample, id, stats) : render(state.info, t.sample, view, stats)
+    renders.set(key, job.catch(e => { renders.delete(key); throw e }))
+  }
   const stop = fresh ? followLoad(`${view.label} · ${pick.cell.name}`, stats) : () => {}
   try {
     const r = await renders.get(key).finally(stop)
@@ -440,6 +537,23 @@ function refreshShown() {
 const shownBand = () => (pick.shown && pick.bands.includes(pick.shown.label) ? pick.shown.label : null)
 
 function updateDownloads() {
+  const viirs = state.info?.kind === 'viirs'
+  $('dl-all').hidden = viirs
+  $('dl-all').textContent = 'All bands (.zip)'
+  if (state.info?.kind === 'aef') {                       // the shown image, or the shown band; all 64 bands at 10 m
+    const band = pick.shown?.window
+    $('dl-band').disabled = !pick.shown
+    $('dl-band').textContent = band ? 'Download band (.tif)' : 'Download image (.png)'
+    $('dl-band').title = band ? 'The band at 10 m: a GeoTIFF, int8, north up' : 'The image as shown'
+    $('dl-all').disabled = false; $('dl-all').textContent = 'All 64 bands (.tif)'
+    $('dl-all').title = 'Every band at 10 m: a GeoTIFF of about 73 MB; reads about 120 MB'
+    return
+  }
+  if (viirs) {
+    $('dl-band').disabled = false; $('dl-band').textContent = 'Download tile (.tif)'
+    $('dl-band').title = 'The tile as stored: a GeoTIFF, radiance in nW/cm²/sr'
+    return
+  }
   const band = shownBand()
   $('dl-band').disabled = !band
   $('dl-band').textContent = band ? `Download ${band} (.tif)` : 'Download band (.tif)'
@@ -458,17 +572,42 @@ async function downloading(button, job) {
   } finally { button.textContent = label; updateDownloads() }
 }
 
-$('dl-band').addEventListener('click', () => downloading($('dl-band'),
-  () => downloadBand(state.info, state.name, pick.cell.name, pick.thumbnail.sample, shownBand())))
+const aefName = (sample, what) => `${pick.cell.name}_AEF_${sample.year}_${what}`
+
+$('dl-band').addEventListener('click', async () => {
+  if (state.info.kind === 'aef') {
+    const s = pick.thumbnail.sample, w = pick.shown.window
+    if (w) downloadAefTiff(w, `${aefName(s, pick.shown.label.split(',')[0].replace('Band ', ''))}.tif`)
+    else await downloadImage(pick.shown.src, `${aefName(s, 'pca')}.png`)
+    $('pick-stats').textContent = 'Downloaded: from what is shown, nothing read'
+    return
+  }
+  if (state.info.kind === 'viirs') {
+    downloadViirs(pick.cell.name, pick.thumbnail.sample, pick.thumbnail.bytes)
+    $('pick-stats').textContent = `Downloaded: ${kb(pick.thumbnail.bytes.length)}, read before`
+    return
+  }
+  downloading($('dl-band'), () => downloadBand(state.info, state.name, pick.cell.name, pick.thumbnail.sample, shownBand()))
+})
 $('dl-all').addEventListener('click', () => downloading($('dl-all'), async () => {
   const stats = newStats(), stop = followLoad(`All bands · ${pick.cell.name} · for download`, stats)
+  if (state.info.kind === 'aef') {
+    try {
+      const s = pick.thumbnail.sample, w = await aefWindow(state.info, s, 0, Array.from({ length: 64 }, (_, b) => b), stats)
+      downloadAefTiff(w, `${aefName(s, 'A00-A63')}.tif`)
+      stats.read = performance.now() - stats.t0
+      return stats
+    } finally { stop() }
+  }
   try {
     return await downloadAll(state.info, state.name, pick.cell.name, pick.thumbnail.sample, pick.thumbnail.src,
       pick.thumbnail.productId, stats)
   } finally { stop() }
 }))
 $('dl-python').addEventListener('click', async () => {
-  const code = pythonSnippet(state.info, state.name, pick.cell.name, pick.thumbnail.sample, pick.bands.length ? pick.bands : ['thumbnail'])
+  const code = state.info.kind === 'aef' ? aefSnippet(pick.cell.name, pick.thumbnail.sample, await aefCell(state.info, pick.thumbnail.sample))
+    : state.info.kind === 'viirs' ? viirsSnippet(state.info, pick.cell.name, pick.thumbnail.sample)
+    : pythonSnippet(state.info, state.name, pick.cell.name, pick.thumbnail.sample, pick.bands.length ? pick.bands : ['thumbnail'])
   window.lastSnippet = code                                                         // for automated checks
   try { await navigator.clipboard.writeText(code); $('pick-stats').textContent = 'Python copied to the clipboard' }
   catch { window.prompt('Python that reads this sample:', code) }
@@ -535,7 +674,15 @@ function meta(sample, productId, info) {
   if (sample.cloud_cover !== undefined && sample.cloud_cover !== null) rows.push(['Cloud cover', `${sample.cloud_cover.toFixed(1)}%`])
   if (sample.orbit_state) rows.push(['Orbit', sample.orbit_state])
   if (productId) rows.push(['Product', productId])
-  const url = imageUrl(info, sample.part)
-  rows.push(['File', `<a href="${url.replace('/resolve/', '/blob/')}" target="_blank" rel="noopener">part_${String(sample.part).padStart(5, '0')}</a>, row ${sample.parquet_row}`])
+  if (info.kind === 'aef') {
+    rows.push(['Year', `${sample.year} (annual embedding)${sample.year === sample.cellYear ? ', the Sentinel-2 year' : ''}`])
+    rows.push(['Source', `<a href="${info.link}" target="_blank" rel="noopener">tge-labs/aef</a>, CC-BY 4.0`])
+  } else if (info.kind === 'viirs') {
+    rows.push(['Year', `${sample.year} (annual median)`])
+    rows.push(['File', `<a href="${info.files.replace('/resolve/', '/blob/')}${sample.shard}" target="_blank" rel="noopener">${sample.shard.split('/').pop()}</a>, bytes ${sample.offset.toLocaleString('en')} + ${sample.size.toLocaleString('en')}`])
+  } else {
+    const url = imageUrl(info, sample.part)
+    rows.push(['File', `<a href="${url.replace('/resolve/', '/blob/')}" target="_blank" rel="noopener">part_${String(sample.part).padStart(5, '0')}</a>, row ${sample.parquet_row}`])
+  }
   $('pick-meta').innerHTML = rows.map(([k, v]) => `<dt>${k}</dt><dd>${v}</dd>`).join('')
 }

build_index.py

@@ -9,8 +9,21 @@
          row groups of 65,536 rows with statistics and a page index, no value dictionaries (as the climate files):
          the app reads the two position columns for the coverage map and, for a click, the page holding the cell
       -> footprints/datasets.json: per dataset its label, the URL base of its image files, its samples
+    Core-VIIRS-Nighttime-Light/INDEX.parquet on Hugging Face (one row per tile: id MT10_<cell>, year, shard, offset,
+    size, in no cell order)
+      -> footprints/VIIRS.parquet: grid_row_u, grid_col_r, year, shard, offset, size, sorted by cell; the app reads a
+         tile with one range request into its zip shard (viirs.js)
 
-    python build_index.py /data/Major-TOM <out folder>        (Slurm, .venv311)
+    AlphaEarth (tge-labs/aef on source.coop): aef_index.parquet, one row per COG tile and year (81,920 m UTM squares,
+    the same 34,266 squares every year) + the Core-S2L2A cells
+      -> footprints/AEF.parquet: per cell grid_row_u, grid_col_r, centre_lat, centre_lon, year (its Sentinel-2 year,
+         within 2017-2025), tile_row, tile_rows: lists, one entry per tile its 10,680 m window touches (the tile
+         holding the centre first, then those under the window's corners in the same UTM zone; a zone's tiles share
+         one 81,920 m grid): where that tile's rows are in AEF-tiles.parquet; the tile holding the
+         cell centre, in the cell's own UTM zone where there is one
+      -> footprints/AEF-tiles.parquet: tile, year, epsg, west, north, path: one row per tile and year, by tile
+
+    python build_index.py /data/Major-TOM <out folder> [name ...]   (Slurm, .venv311; names: rebuild only those)
 """
 from __future__ import annotations
 
@@ -19,6 +32,7 @@ import re
 import sys
 from pathlib import Path
 
+import fsspec
 import numpy as np
 import pyarrow as pa
 import pyarrow.compute as pc
@@ -27,6 +41,9 @@ import pyarrow.parquet as pq
 DATASETS = {"S2L2A": "Sentinel-2 L2A", "S2L1C": "Sentinel-2 L1C", "S1RTC": "Sentinel-1 RTC", "DEM": "COP-DEM"}
 EXTRA = ["timestamp", "cloud_cover", "orbit_state"]                      # kept where a dataset has them
 ROW_GROUP = 65_536
+VIIRS = "https://huggingface.co/datasets/Major-TOM/Core-VIIRS-Nighttime-Light/resolve/main/"
+AEF = "https://data.source.coop/tge-labs/aef/v1/annual/"
+AEF_TILE = 81_920                                            # metres: every AlphaEarth COG
 
 
 def index(metadata: Path, name: str) -> tuple[pa.Table, str]:
@@ -61,25 +78,120 @@ def epsg(crs: list[str]) -> np.ndarray:
     return codes.astype(np.int16)
 
 
+def viirs() -> pa.Table:
+    """The VIIRS footprint table, from the dataset's INDEX.parquet: the cell from the tile id, the tile's place."""
+    with fsspec.open(f"{VIIRS}INDEX.parquet", "rb", block_size=2**24) as f:
+        table = pq.read_table(f, columns=["id", "year", "shard", "offset", "size"])
+    parts = pc.extract_regex(table.column("id"), r"^MT10_(?P<r>\d+)(?P<u>[UD])_(?P<c>\d+)(?P<l>[LR])$")
+    if parts.null_count:
+        raise ValueError("a VIIRS id outside MT10_<row><U|D>_<col><L|R>")
+    sign = lambda letter, plus: pc.if_else(pc.equal(pc.struct_field(parts, letter), plus), 1, -1)
+    row = pc.multiply(pc.cast(pc.struct_field(parts, "r"), pa.int16()), pc.cast(sign("u", "U"), pa.int16()))
+    col = pc.multiply(pc.cast(pc.struct_field(parts, "c"), pa.int16()), pc.cast(sign("l", "R"), pa.int16()))
+    out = pa.table({"grid_row_u": row, "grid_col_r": col, "year": pc.cast(table.column("year"), pa.int16()),
+                    "shard": table.column("shard"), "offset": pc.cast(table.column("offset"), pa.int64()),
+                    "size": pc.cast(table.column("size"), pa.int32())})
+    return out.sort_by([("grid_row_u", "ascending"), ("grid_col_r", "ascending"), ("year", "ascending")])
+
+
+def aef(core: Path) -> tuple[pa.Table, pa.Table]:
+    """AlphaEarth: the cell table (Core-S2L2A cells -> the tile holding each centre) and the tile table."""
+    import pandas as pd
+    from pyproj import Transformer
+
+    with fsspec.open(f"{AEF}aef_index.parquet", "rb", block_size=2**24) as f:
+        idx = pq.read_table(f, columns=["path", "year", "crs", "utm_west", "utm_south"]).to_pandas()
+    idx["epsg"] = idx.crs.str.split(":").str[-1].astype(int)
+    idx["path"] = idx.path.str.replace("s3://us-west-2.opendata.source.coop/tge-labs/aef/v1/annual/", "", regex=False)
+    squares = idx.drop_duplicates(["epsg", "utm_west", "utm_south"])[["epsg", "utm_west", "utm_south"]]
+    squares = squares.sort_values(["epsg", "utm_south", "utm_west"]).reset_index(drop=True)
+    squares["tile"] = np.arange(len(squares), dtype=np.int32)
+    tiles = idx.merge(squares, on=["epsg", "utm_west", "utm_south"]).sort_values(["tile", "year"]).reset_index(drop=True)
+
+    cells = pq.read_table(core / "Core-S2L2A" / "metadata.parquet",
+                          columns=["grid_row_u", "grid_col_r", "centre_lat", "centre_lon", "crs", "timestamp"]).to_pandas()
+    cells["own"] = epsg(cells.crs.tolist()).astype(int)
+    cells["tile"] = -1
+    for own_zone_first in (True, False):                     # a cell near a zone edge may lie in a neighbour's square
+        for code, group in squares.groupby("epsg"):
+            pick = (cells.tile < 0) & ((cells.own == code) if own_zone_first else (abs(cells.own - code) == 1))
+            if not pick.any():
+                continue
+            x, y = Transformer.from_crs(4326, int(code), always_xy=True).transform(
+                cells.centre_lon[pick].to_numpy(), cells.centre_lat[pick].to_numpy())
+            west, south = group.utm_west.to_numpy(), group.utm_south.to_numpy()
+            inside = ((x[:, None] >= west) & (x[:, None] < west + AEF_TILE) &
+                      (y[:, None] >= south) & (y[:, None] < south + AEF_TILE))
+            hit = inside.any(1)
+            cells.loc[cells.index[pick][hit], "tile"] = group.tile.to_numpy()[inside[hit].argmax(1)]
+    cells = cells[cells.tile >= 0].reset_index(drop=True)
+    first = tiles.reset_index().groupby("tile")["index"].agg(["min", "count"])
+    lookup = {(e, w, s): k for e, w, s, k in squares[["epsg", "utm_west", "utm_south", "tile"]].itertuples(index=False)}
+    parts = [[k] for k in cells.tile]                         # tiles of each cell's window, its own first
+    own = squares.set_index("tile").loc[cells.tile]
+    for code in np.unique(own.epsg):
+        rows = np.flatnonzero(own.epsg.to_numpy() == code)
+        x, y = Transformer.from_crs(4326, int(code), always_xy=True).transform(
+            cells.centre_lon.to_numpy()[rows], cells.centre_lat.to_numpy()[rows])
+        w0, s0 = own.utm_west.to_numpy()[rows], own.utm_south.to_numpy()[rows]
+        for dx in (-5340, 5340):
+            for dy in (-5340, 5340):
+                west = w0 + np.floor((x + dx - w0) / AEF_TILE) * AEF_TILE
+                south = s0 + np.floor((y + dy - s0) / AEF_TILE) * AEF_TILE
+                for r, wv, sv in zip(rows[(west != w0) | (south != s0)], west[(west != w0) | (south != s0)],
+                                     south[(west != w0) | (south != s0)]):
+                    k = lookup.get((int(code), float(wv), float(sv)))
+                    if k is not None and k not in parts[r]:
+                        parts[r].append(k)
+    year = cells.timestamp.str[:4].astype(int).clip(2017, 2025)
+    cell_table = pa.table({"grid_row_u": pa.array(cells.grid_row_u.to_numpy(np.int16)),
+                           "grid_col_r": pa.array(cells.grid_col_r.to_numpy(np.int16)),
+                           "centre_lat": pa.array(cells.centre_lat.to_numpy(np.float32)),
+                           "centre_lon": pa.array(cells.centre_lon.to_numpy(np.float32)),
+                           "year": pa.array(year.to_numpy(np.int16)),
+                           "tile_row": pa.array([[int(first.at[k, "min"]) for k in ks] for ks in parts], pa.list_(pa.int32())),
+                           "tile_rows": pa.array([[int(first.at[k, "count"]) for k in ks] for ks in parts], pa.list_(pa.int16()))})
+    counts = np.bincount([len(ks) for ks in parts])
+    print("AEF tiles per cell window:", {n: int(c) for n, c in enumerate(counts) if c}, flush=True)
+    tile_table = pa.table({"tile": pa.array(tiles.tile.to_numpy(np.int32)), "year": pa.array(tiles.year.to_numpy(np.int16)),
+                           "epsg": pa.array(tiles.epsg.to_numpy(np.int32)),
+                           "west": pa.array(tiles.utm_west.to_numpy(np.float64)),
+                           "north": pa.array((tiles.utm_south + AEF_TILE).to_numpy(np.float64)),
+                           "path": pa.array(tiles.path.tolist())})
+    return cell_table.sort_by([("grid_row_u", "ascending"), ("grid_col_r", "ascending")]), tile_table
+
+
 def write(table: pa.Table, path: Path) -> None:
-    keys = ["grid_row_u", "grid_col_r", "orbit_state", "epsg"]
+    keys = ["grid_row_u", "grid_col_r", "orbit_state", "epsg", "shard"]
     pq.write_table(table, path, row_group_size=ROW_GROUP, compression="zstd", write_statistics=True,
                    write_page_index=True, use_dictionary=[c for c in keys if c in table.column_names],
                    data_page_size=4096)
 
 
-def main(core: str, out: str) -> None:
+def main(core: str, out: str, *only: str) -> None:
     core, out = Path(core), Path(out)
     out.mkdir(parents=True, exist_ok=True)
-    listing = {}
-    for name, label in DATASETS.items():
-        table, base = index(core / f"Core-{name}" / "metadata.parquet", name)
+    listing = json.loads((out / "datasets.json").read_text()) if only else {}
+    for name in only or [*DATASETS, "VIIRS", "AEF"]:
+        if name == "AEF":
+            table, tile_table = aef(core)
+            write(tile_table, out / "AEF-tiles.parquet")
+            entry = {"label": "AlphaEarth Embeddings", "kind": "aef", "files": AEF, "tiles": "AEF-tiles.parquet",
+                     "years": [2017, 2025], "link": "https://source.coop/tge-labs/aef"}
+        elif name == "VIIRS":
+            table = viirs()
+            entry = {"label": "VIIRS Nighttime Light", "kind": "viirs", "files": VIIRS,
+                     "link": "https://huggingface.co/datasets/Major-TOM/Core-VIIRS-Nighttime-Light"}
+        else:
+            table, base = index(core / f"Core-{name}" / "metadata.parquet", name)
+            entry = {"label": DATASETS[name], "images": base}
         write(table, out / f"{name}.parquet")
-        listing[name] = {"label": label, "images": base, "samples": table.num_rows,
-                         "columns": table.column_names}
+        listing[name] = {**entry, "samples": table.num_rows, "columns": table.column_names}
         print(f"{name}: {table.num_rows:,} samples -> {(out / f'{name}.parquet').stat().st_size / 1e6:.1f} MB", flush=True)
+    order = [*DATASETS, "VIIRS", "AEF"]
+    listing = {k: listing[k] for k in sorted(listing, key=order.index)}
     (out / "datasets.json").write_text(json.dumps(listing, indent=1) + "\n")
 
 
 if __name__ == "__main__":
-    main(*sys.argv[1:3])
+    main(*sys.argv[1:])

download.js

@@ -3,6 +3,8 @@
 //   one band   -> <cell>_<dataset>_<time>_<band>.tif
 //   all bands  -> <cell>_<dataset>_<time>.zip: every band's .tif, the thumbnail, metadata.json (where it came from)
 //   Python     -> a snippet that reads the same row group from Hugging Face (copied to the clipboard)
+//   VIIRS      -> the tile's GeoTIFF as stored in its zip shard (already read); Python reads the same byte range
+//   AlphaEarth -> the shown image (.png); the shown band or all 64 at 10 m as a GeoTIFF written here; Python (rasterio)
 
 import { zipSync } from 'https://cdn.jsdelivr.net/npm/fflate@0.8.2/+esm'
 import { bandNames, readBands } from './bands.js'
@@ -54,3 +56,94 @@ with fsspec.open(url, "rb") as f:                      # reads only the parts of
 # from rasterio.io import MemoryFile; MemoryFile(row["${bands[0]}"][0].as_py()).open().read(1)
 `
 }
+
+/** A VIIRS tile's GeoTIFF, as stored in its zip shard (the bytes the panel already read). */
+export function downloadViirs(cell, sample, bytes) {
+  save(new Blob([bytes], { type: 'image/tiff' }), `${cell}_VIIRS_${sample.year}.tif`)
+}
+
+/** Python that reads the same VIIRS tile: its byte range of the zip shard, opened as a GeoTIFF. */
+export function viirsSnippet(info, cell, sample) {
+  return `import fsspec
+from rasterio.io import MemoryFile
+
+url = "${info.files}${sample.shard}"
+with fsspec.open(url, "rb") as f:                      # one range request: the tile is stored uncompressed in the zip
+    f.seek(${sample.offset}); tile = f.read(${sample.size})
+radiance = MemoryFile(tile).open().read(1)             # ${cell}, ${sample.year}: nW/cm²/sr, 10 m, float32
+`
+}
+
+// ---- AlphaEarth: GeoTIFFs written here (int8, uncompressed, one strip per band), the shown image, Python ---------
+
+const TIFF_BYTES = { 2: 1, 3: 2, 4: 4, 12: 8 }                       // ASCII, SHORT, LONG, DOUBLE
+
+/** int8 bands (north up, NODATA -128) as a GeoTIFF in a UTM zone: west and north edges in metres, square pixels. */
+export function int8GeoTiff(bands, size, { epsg, west, north, res }) {
+  const n = bands.length, plane = size * size
+  const entries = [[256, 4, [size]], [257, 4, [size]], [258, 3, Array(n).fill(8)], [259, 3, [1]], [262, 3, [1]],
+    [273, 4, Array(n).fill(0)], [277, 3, [n]], [278, 4, [size]], [279, 4, Array(n).fill(plane)], [284, 3, [2]],
+    ...(n > 1 ? [[338, 3, Array(n - 1).fill(0)]] : []), [339, 3, Array(n).fill(2)],
+    [33550, 12, [res, res, 0]], [33922, 12, [0, 0, 0, west, north, 0]],
+    [34735, 3, [1, 1, 0, 3, 1024, 0, 1, 1, 1025, 0, 1, 1, 3072, 0, 1, epsg]],     // projected, pixel is area, EPSG
+    [42113, 2, [...'-128'].map(c => c.charCodeAt(0)).concat(0)]]                  // GDAL_NODATA
+  let at = 8 + 2 + 12 * entries.length + 4
+  const places = entries.map(([, type, values]) => {
+    const bytes = values.length * TIFF_BYTES[type]
+    if (bytes <= 4) return null
+    const here = at; at += bytes + (bytes % 2); return here
+  })
+  entries[5][2] = bands.map((_, b) => at + b * plane)                               // StripOffsets: after the values
+  const buffer = new ArrayBuffer(at + n * plane), view = new DataView(buffer), bytes = new Uint8Array(buffer)
+  const put = (offset, type, v) => {
+    if (type === 2) view.setUint8(offset, v)
+    else if (type === 3) view.setUint16(offset, v, true)
+    else if (type === 4) view.setUint32(offset, v, true)
+    else view.setFloat64(offset, v, true)
+  }
+  view.setUint16(0, 0x4949, true); view.setUint16(2, 42, true); view.setUint32(4, 8, true)
+  view.setUint16(8, entries.length, true)
+  entries.forEach(([tag, type, values], k) => {
+    const e = 10 + 12 * k
+    view.setUint16(e, tag, true); view.setUint16(e + 2, type, true); view.setUint32(e + 4, values.length, true)
+    const base = places[k] ?? e + 8
+    if (places[k] !== null) view.setUint32(e + 8, base, true)
+    values.forEach((v, i) => put(base + i * TIFF_BYTES[type], type, v))
+  })
+  bands.forEach((band, b) => bytes.set(new Uint8Array(band.buffer, band.byteOffset, plane), at + b * plane))
+  return new Blob([buffer], { type: 'image/tiff' })
+}
+
+/** The shown image (a PNG object URL), saved as drawn. */
+export async function downloadImage(src, filename) {
+  save(await (await fetch(src)).blob(), filename)
+}
+
+/** int8 bands of the AlphaEarth window as a GeoTIFF. */
+export function downloadAefTiff(window, filename) {
+  save(int8GeoTiff(window.bands, window.size, { epsg: window.cell.epsg, west: window.west, north: window.north, res: window.res }),
+    filename)
+}
+
+/** Python that reads the same AlphaEarth window: each tile's part (a windowed read; the files are stored south-up),
+ *  joined, north up, on the 10 m grid the app uses. */
+export function aefSnippet(cellName, sample, cell) {
+  const west = Math.round((cell.cx - 5340) / 10) * 10, north = Math.round((cell.cy - 5340) / 10) * 10 + 10680
+  return `import numpy as np
+import rasterio
+from rasterio.windows import Window
+
+urls = ${JSON.stringify(cell.urls, null, 4).replace(/\n\]$/, ',\n]')}
+west, north = ${west}, ${north}   # ${cellName}, EPSG:${cell.epsg}: 1,068 x 1,068 pixels of 10 m
+embedding = np.full((64, 1068, 1068), -128, np.int8)      # AlphaEarth ${sample.year} (tge-labs/aef, CC-BY 4.0)
+for url in urls:                                          # every tile under the cell
+    with rasterio.open(url) as src:
+        t = src.transform                                 # t.e > 0: stored south-up
+        edge = north - 10680 if t.e > 0 else north
+        win = Window(round((west - t.c) / t.a), round((edge - t.f) / t.e), 1068, 1068)
+        part = src.read(window=win, boundless=True, fill_value=-128)
+        if t.e > 0:
+            part = part[:, ::-1]                          # north up
+        embedding = np.where(embedding == -128, part, embedding)
+`
+}

index.html

@@ -83,6 +83,12 @@
   #thumb { width: 100%; height: 100%; object-fit: contain; display: block; }
   #thumb[hidden] { display: none; }
   #thumb { cursor: zoom-in; }
+  #thumb-badge { position: absolute; left: 8px; bottom: 8px; display: flex; align-items: center; gap: 7px; padding: 4px 10px 4px 8px;
+    border-radius: 999px; background: rgba(17, 24, 39, .78); color: #fff; font: 12px var(--sans); pointer-events: none; }
+  #thumb-badge[hidden] { display: none; }
+  #thumb-badge .spin { width: 11px; height: 11px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .35);
+    border-top-color: #fff; animation: spin .8s linear infinite; }
+  @keyframes spin { to { transform: rotate(360deg); } }
   .image-actions { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: -2px 0 10px; font-size: 13px; }
   .image-actions button { font: inherit; padding: 4px 10px; border: 1px solid var(--line); border-radius: 8px;
     background: var(--surface); color: var(--ink); cursor: pointer; }
@@ -111,6 +117,26 @@
   #choices button { font: 12px var(--mono); padding: 3px 8px; border: 1px solid var(--line); border-radius: 999px;
     background: var(--surface); color: var(--ink-2); cursor: pointer; }
   #choices button[aria-pressed=true] { border-color: var(--mt-blue); color: var(--mt-blue); background: var(--tint); }
+  #weather { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
+  #weather h3 { margin: 0 0 2px; font-size: 15px; font-weight: 600; }
+  .wx-head { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); margin: 14px 0 4px; }
+  .wx-row { margin: 8px 0 0; }
+  .wx-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
+  .wx-label { font-size: 14px; color: var(--ink); }
+  .wx-label small { font-size: 12px; color: var(--ink-3); margin-left: 2px; }
+  .wx-value { font: 500 14px var(--mono); white-space: nowrap; }
+  .wx-value small { font-size: 11px; color: var(--ink-3); font-weight: 400; }
+  .wx-chart { display: block; width: 100%; height: auto; margin-top: 2px; overflow: visible; }
+  .wx-line { fill: none; stroke: var(--mt-blue); stroke-width: 1.6; stroke-linejoin: round; }
+  .wx-area { fill: var(--mt-blue); opacity: .08; }
+  .wx-bars rect { fill: var(--mt-blue); }
+  .wx-dots circle { fill: var(--mt-blue); }
+  .wx-base { stroke: var(--line); }
+  .wx-zero { stroke: var(--mt-orange); stroke-width: 1; stroke-dasharray: 2 2; }
+  .wx-now { fill: var(--mt-orange); stroke: var(--surface); stroke-width: 1.5; }
+  .wx-tick { font: 10px var(--mono); fill: var(--ink-3); text-anchor: end; }
+  .wx-none { font: 11px var(--sans); fill: var(--ink-3); text-anchor: middle; }
+  .wx-axis { display: flex; justify-content: space-between; font: 10px var(--mono); color: var(--ink-3); margin: 4px 40px 0 0; padding-top: 3px; border-top: 1px solid var(--line); }
   .tiny { font: 11px/1.4 var(--mono); color: var(--ink-3); min-height: 1em; margin-top: 8px; }
   dl { display: grid; grid-template-columns: auto 1fr; gap: 3px 14px; margin: 0; font-size: 14px; }
   dt { color: var(--ink-3); }
@@ -180,11 +206,9 @@
       <div class="pick-name"><b id="pick-cell"></b><span id="pick-pos"></span></div>
       <div id="choices"></div>
       <label class="view-row" id="view-row" hidden>View <select id="view" aria-label="Band or composite"></select></label>
-      <div id="thumb-wrap"><img id="thumb" alt="Thumbnail of the selected sample" hidden><span id="thumb-note"></span></div>
+      <div id="thumb-wrap"><img id="thumb" alt="Thumbnail of the selected sample" hidden><span id="thumb-note"></span><div id="thumb-badge" hidden><span class="spin"></span><span id="thumb-badge-text"></span></div></div>
       <div class="image-actions" id="image-actions" hidden>
-        <button id="open-image">Open</button>
-        <label><input type="checkbox" id="on-map"> Show on map</label>
-        <label>Opacity <input type="range" id="opacity" min="0" max="100" value="100" aria-label="Opacity on the map"></label>
+        <button id="open-image" title="The image in the full window: zoom, pan, value under the cursor">Enlarge</button>
       </div>
       <div class="image-actions" id="download-actions" hidden>
         <button id="dl-band" title="The shown band as stored: a GeoTIFF">Download band (.tif)</button>
@@ -193,6 +217,14 @@
       </div>
       <dl id="pick-meta"></dl>
       <div class="tiny" id="pick-stats"></div>
+      <div id="weather" hidden>
+        <h3>Weather at acquisition</h3>
+        <p class="note" id="wx-from" hidden></p>
+        <div class="wx-head">Hourly · 24 hours either side</div><div id="wx-hourly"></div>
+        <div class="wx-head">Daily · 30 days either side</div><div id="wx-daily"></div>
+        <div class="tiny" id="wx-stats"></div>
+        <p class="note">Means over the 10 km cell, from Core-Weather on source.coop. Orange: the acquisition.</p>
+      </div>
     </section>
 
     <section>

viirs.js

@@ -0,0 +1,46 @@
+// VIIRS Nighttime Light tiles (Major-TOM/Core-VIIRS-Nighttime-Light), read from their zip shards and coloured here.
+//
+//   footprint row (shard, offset, size) -> one range request: the tile's GeoTIFF, stored uncompressed in the zip
+//     -> geotiff.js (zstd tiles: decoder in zstd.js) -> radiance, nW/cm²/sr
+//     -> log scale 0.1-100 in inferno, the Core Viewer's fixed scale, so tiles compare -> PNG
+//   the GeoTIFF bytes are kept: the download is the tile as stored
+//   corners from the GeoTIFF's own bounds and UTM zone: VIIRS tiles are 1,056 px at 10 m on the v2 grid, not the
+//   Core images' 10,680 m squares
+
+import { fromArrayBuffer } from 'https://cdn.jsdelivr.net/npm/geotiff@2.1.3/+esm'
+import proj4 from 'https://cdn.jsdelivr.net/npm/proj4@2.12.1/+esm'
+import './zstd.js'
+
+// matplotlib's inferno at nine stops
+const INFERNO = [[0, 0, 4], [31, 12, 72], [85, 15, 109], [136, 34, 106], [186, 54, 85], [227, 89, 51], [249, 140, 10],
+  [249, 201, 50], [252, 255, 164]]
+const LO = Math.log10(0.1), HI = Math.log10(100)
+
+function inferno(t) {
+  const f = Math.min(Math.max(t, 0), 1) * (INFERNO.length - 1), k = Math.min(Math.floor(f), INFERNO.length - 2), u = f - k
+  return INFERNO[k].map((c, i) => c + u * (INFERNO[k + 1][i] - c))
+}
+
+/** The sample's tile: {src (PNG object URL), size, values (radiance, for the cursor), corners, bytes (the GeoTIFF), stats}. */
+export async function loadViirs(info, sample, stats) {
+  const r = await fetch(`${info.files}${sample.shard}`, { headers: { Range: `bytes=${sample.offset}-${sample.offset + sample.size - 1}` } })
+  if (r.status !== 206) throw new Error(`${sample.shard}: HTTP ${r.status}, not a byte range`)
+  const buffer = await r.arrayBuffer()
+  stats.bytes += buffer.byteLength; stats.requests += 1
+  const image = await (await fromArrayBuffer(buffer)).getImage(), [values] = await image.readRasters()
+  const size = image.getWidth(), canvas = new OffscreenCanvas(size, size), ctx = canvas.getContext('2d')
+  const img = ctx.createImageData(size, size)
+  for (let i = 0; i < values.length; i++) {
+    const v = values[i], o = i * 4
+    if (!Number.isFinite(v)) continue                                    // transparent
+    const [red, green, blue] = inferno((Math.log10(Math.max(v, 0.1)) - LO) / (HI - LO))
+    img.data[o] = red; img.data[o + 1] = green; img.data[o + 2] = blue; img.data[o + 3] = 255
+  }
+  ctx.putImageData(img, 0, 0)
+  const src = URL.createObjectURL(await canvas.convertToBlob({ type: 'image/png' }))
+  const [west, south, east, north] = image.getBoundingBox(), epsg = image.geoKeys.ProjectedCSTypeGeoKey
+  const utm = proj4(`+proj=utm +zone=${epsg % 100}${epsg > 32700 ? ' +south' : ''} +datum=WGS84 +units=m +no_defs`)
+  const corners = [[west, north], [east, north], [east, south], [west, south]].map(p => utm.inverse(p))
+  stats.read = performance.now() - stats.t0
+  return { src, size, values: { width: size, values, unit: 'nW/cm²/sr' }, corners, bytes: new Uint8Array(buffer), stats }
+}

weather.js

@@ -0,0 +1,124 @@
+// Core-Weather for one sample, from source.coop: the hourly (±24 h) and daily (±30 d) rows of its acquisition.
+//
+//   sample (cell name, timestamp "20221211T114501") -> <hourly|daily>/year=YYYY/YYYY-MM-DD.parquet (one row group,
+//     rows sorted by grid_cell) -> footer, grid_cell and acquired (whole column, ~20 KB) -> the sample's row range
+//     -> the chart columns for that range only -> one small chart per variable, step 0 marked
+//   ERA5 for temperature, precipitation and cloud: it covers every cell (ERA5-Land is land only, and south of 57.1°S
+//   is not filled yet).
+
+import { compressors, newStats, openFile, parquetRead } from './parquet.js'
+
+export const WEATHER = 'https://data.source.coop/major-tom/core-weather'
+
+// [column, label, source, unit, value as shown, mark]: line (states), bars from zero (amounts), dots (one overpass a day)
+const HOURLY = [
+  ['era5_t2m', 'Temperature', 'ERA5, 2 m', '°C', v => v - 273.15, 'line'],
+  ['era5_tp', 'Precipitation', 'ERA5', 'mm', v => v * 1000, 'bars'],
+  ['era5_tcc', 'Cloud cover', 'ERA5', '%', v => v * 100, 'line'],
+]
+const DAILY = [
+  ['era5_t2m_mean', 'Temperature', 'ERA5, 2 m, daily mean', '°C', v => v - 273.15, 'line'],
+  ['era5_tp_sum', 'Precipitation', 'ERA5', 'mm', v => v * 1000, 'bars'],
+  ['cams_pm2p5_mean', 'PM2.5', 'CAMS', 'µg/m³', v => v * 1e9, 'line'],
+  ['s5p_no2', 'NO₂ column', 'Sentinel-5P', 'µmol/m²', v => v * 1e6, 'dots'],
+]
+
+const ms = v => (v instanceof Date ? v.getTime() : typeof v === 'bigint' ? Number(v / 1000000n) : Number(v))
+
+/** The rows of one table for (cell, acquired ms): {step: [...], <column>: [...]}, or null if the cell is absent. */
+async function readTable(table, day, cell, acquired, columns, step, stats) {
+  const url = `${WEATHER}/${table}/year=${day.slice(0, 4)}/${day}.parquet`
+  const { file, metadata } = await openFile(url, stats)
+  let keys
+  await parquetRead({ file, metadata, compressors, columns: ['grid_cell', 'acquired'], rowFormat: 'object',
+    onComplete(rows) { keys = rows } })
+  let rowStart = -1, rowEnd = -1
+  for (let i = 0; i < keys.length; i++) {
+    if (keys[i].grid_cell !== cell || ms(keys[i].acquired) !== acquired) { if (rowStart >= 0) break; continue }
+    if (rowStart < 0) rowStart = i
+    rowEnd = i + 1
+  }
+  if (rowStart < 0) return null
+  let rows
+  await parquetRead({ file, metadata, compressors, columns: [step, ...columns], rowStart, rowEnd, rowFormat: 'object',
+    onComplete(r) { rows = r } })
+  const out = { step: rows.map(r => Number(r[step])) }
+  for (const c of columns) out[c] = rows.map(r => (r[c] === null || r[c] === undefined ? null : Number(r[c])))
+  return out
+}
+
+/** Both tables for one sample: {hourly, daily, stats}; a table is null where Core-Weather has no row. */
+export async function loadWeather(cell, timestamp) {
+  const stats = newStats()
+  const t = timestamp, day = `${t.slice(0, 4)}-${t.slice(4, 6)}-${t.slice(6, 8)}`
+  const acquired = Date.UTC(+t.slice(0, 4), +t.slice(4, 6) - 1, +t.slice(6, 8), +t.slice(9, 11), +t.slice(11, 13), +t.slice(13, 15))
+  const [hourly, daily] = await Promise.all([
+    readTable('hourly', day, cell, acquired, HOURLY.map(c => c[0]), 'step_h', stats),
+    readTable('daily', day, cell, acquired, DAILY.map(c => c[0]), 'step_d', stats),
+  ])
+  stats.read = performance.now() - stats.t0
+  return { hourly, daily, stats }
+}
+
+/** One block per variable: name, source and the value at the acquisition above a chart of the steps; then the
+ *  steps' axis. */
+export function weatherRows(table, which) {
+  if (!table) return []
+  const spec = which === 'hourly' ? HOURLY : DAILY, unit = which === 'hourly' ? 'h' : 'd'
+  const blocks = spec.map(([column, label, source, units, show, mark]) => {
+    const values = table[column].map(v => (v === null || Number.isNaN(v) ? null : show(v)))
+    const at0 = values[table.step.indexOf(0)]
+    const block = document.createElement('div')
+    block.className = 'wx-row'
+    block.innerHTML = `<div class="wx-top"><span class="wx-label">${label} <small>${source}</small></span>` +
+      `<span class="wx-value">${at0 === null || at0 === undefined ? '–' : `${fmt(at0)}<small> ${units}</small>`}</span></div>` +
+      chart(table.step, values, mark)
+    return block
+  })
+  const s0 = table.step[0], s1 = table.step[table.step.length - 1]
+  const axis = document.createElement('div')
+  axis.className = 'wx-axis'
+  axis.innerHTML = `<span>${s0} ${unit}</span><span>acquisition</span><span>+${s1} ${unit}</span>`
+  return [...blocks, axis]
+}
+
+const fmt = v => (Math.abs(v) >= 100 ? v.toFixed(0) : Math.abs(v) >= 10 ? v.toFixed(1) : v.toFixed(2))
+
+/** A chart of one series over the steps: its own y range (from zero for bars), the acquisition as a vertical line
+ *  with a dot, the range's ends written at the right. Drawn at 300 x 44 and scaled as a whole (no distortion). */
+function chart(steps, values, mark) {
+  const W = 300, H = 44, L = 2, R = 40, T = 5, B = 5
+  const known = values.filter(v => v !== null)
+  const empty = `<svg class="wx-chart" viewBox="0 0 ${W} ${H}" aria-hidden="true"><text x="${(W - R) / 2}" y="${H / 2 + 4}" class="wx-none">no data</text></svg>`
+  if (!known.length) return empty
+  let lo = Math.min(...known), hi = Math.max(...known)
+  if (mark === 'bars') lo = 0
+  if (hi === lo) hi = lo + 1
+  const s0 = steps[0], s1 = steps[steps.length - 1], step = (W - L - R) / (s1 - s0)
+  const x = s => L + (s - s0) * step
+  const y = v => H - B - ((v - lo) / (hi - lo)) * (H - T - B)
+  let body = ''
+  if (mark === 'bars') {
+    const w = Math.max(step * 0.7, 1)
+    steps.forEach((s, i) => {
+      if (values[i] > 0) body += `<rect x="${(x(s) - w / 2).toFixed(1)}" y="${y(values[i]).toFixed(1)}" width="${w.toFixed(1)}" height="${(y(0) - y(values[i])).toFixed(1)}" rx="1"/>`
+    })
+    body = `<line x1="${L}" x2="${W - R}" y1="${y(0)}" y2="${y(0)}" class="wx-base"/><g class="wx-bars">${body}</g>`
+  } else if (mark === 'dots') {
+    steps.forEach((s, i) => { if (values[i] !== null) body += `<circle cx="${x(s).toFixed(1)}" cy="${y(values[i]).toFixed(1)}" r="2"/>` })
+    body = `<g class="wx-dots">${body}</g>`
+  } else {
+    const runs = [[]]
+    steps.forEach((s, i) => (values[i] === null ? runs.push([]) : runs[runs.length - 1].push([x(s), y(values[i])])))
+    for (const run of runs.filter(r => r.length)) {
+      const line = run.map(([a, b], k) => `${k ? 'L' : 'M'}${a.toFixed(1)},${b.toFixed(1)}`).join('')
+      body += `<path class="wx-area" d="${line}L${run[run.length - 1][0].toFixed(1)},${H - B}L${run[0][0].toFixed(1)},${H - B}Z"/>` +
+        `<path class="wx-line" d="${line}"/>`
+    }
+  }
+  const i0 = steps.indexOf(0), v0 = values[i0]
+  const now = `<line x1="${x(0)}" x2="${x(0)}" y1="${T - 3}" y2="${H - B}" class="wx-zero"/>` +
+    (v0 !== null && v0 !== undefined ? `<circle cx="${x(0)}" cy="${y(v0).toFixed(1)}" r="3.5" class="wx-now"/>` : '')
+  const ends = `<text x="${W}" y="${T + 6}" class="wx-tick">${fmt(hi)}</text><text x="${W}" y="${H - B}" class="wx-tick">${fmt(lo)}</text>`
+  return `<svg class="wx-chart" viewBox="0 0 ${W} ${H}" aria-hidden="true">${body}${now}${ends}</svg>`
+}

zstd.js

@@ -0,0 +1,13 @@
+// zstd-compressed GeoTIFF tiles (VIIRS, AlphaEarth): geotiff.js 2.1.3 has no decoder for compression 50000, so one
+// is registered here, on fzstd. Importing this module once is enough: geotiff.js keeps the decoder for every file.
+
+import { addDecoder, BaseDecoder } from 'https://cdn.jsdelivr.net/npm/geotiff@2.1.3/+esm'
+import { decompress } from 'https://cdn.jsdelivr.net/npm/fzstd@0.1.1/+esm'
+
+class ZstdDecoder extends BaseDecoder {
+  decodeBlock(buffer) {
+    const out = decompress(new Uint8Array(buffer))
+    return out.buffer.slice(out.byteOffset, out.byteOffset + out.byteLength)
+  }
+}
+addDecoder(50000, () => ZstdDecoder)