2f:T500,fires = ({ source:{ type: 'vector', tiles: [`https://tiles.globalforestwatch.org/nasa_viirs_fire_alerts/latest/dynamic/{z}/{x}/{y}.pbf?high_confidence_only=true`] }, layer: { id: 'firesLayer', // type: 'heatmap', type: 'circle', source: 'fires', 'source-layer': 'nasa_viirs_fire_alerts', paint: { // 'heatmap-color': [ // 'interpolate', // ['linear'], // ['heatmap-density'], // 0, 'rgba(227, 82, 25, .0)', // .5, 'rgba(168, 104, 79, .3)', // .95, 'rgba(224, 168, 112, .5)', // 1., 'rgba(255, 217, 120, .9)', // ], // 'heatmap-intensity': .05, // 'heatmap-weight': .1 'circle-color': 'rgba(250, 237, 200, .3)', 'circle-stroke-color': 'rgba(237, 143, 81, .1)', 'circle-blur': 1.5, // 'circle-opacity': { // base: 1, // stops: [ // [8, .5], // [16, .7] // ] // }, // 'circle-stroke-opacity': .5, 'circle-radius': [ 'interpolate', ['exponential',2], ['zoom'], 0, 3, 18, 10000 ], 'circle-stroke-width': [ 'interpolate', ['exponential',2], ['zoom'], 0, .05, 18, 100 ], } } })30:T4bd,yearComparisonPlot = (data, height, yScaleDisplay) => { return Plot.plot({ width: 245, height: height, marginTop: 17, marginBottom: 0, marginLeft: 0, marginRight: 0, x: {axis: null, domain: yearsDomain}, y: {label: null, reverse: true, domain: [0, viirsDomain], ticks: yScaleDisplay ? 2 : 0, tickPadding: -30, tickSize: 0, tickFormat: d => d != 0 ? d / 1e3 + ' mil' : ''}, style: {color: colors.loss, background: "#ffffffcc"}, marks: [ Plot.ruleY([0], { stroke: colors.loss, strokeOpacity: .5, }), yScaleDisplay ? Plot.gridY({ ticks: 2, stroke: colors.loss, strokeOpacity: .5, strokeWidth: .5, x1: 2018 }) : null, Plot.barY(data, { x: 'year', y: 'count', fill: d => d.year == currentYear ? colors.alerts : colors.loss, fillOpacity: d => d.year == currentYear ? 1. : 1 - ((currentYear - d.year + 1) * .12), }), Plot.text(data, { x: 'year', y: 0, text: d => d3.format('.0f')(d.year), fill: d => d.year == currentYear ? colors.alerts : colors.loss, stroke: "#fff", dy: -8 }) ] }) }31:T4ef,viirs = { const sourceUrl = "https://www.globalforestwatch.org/api/data/dataset/nasa_viirs_fire_alerts/latest/" const source = await d3.json(sourceUrl) const version = source.data.version const url = `https://www.globalforestwatch.org/api/data/dataset/gadm__viirs__adm2_daily_alerts/${version}/query/?sql=SELECT%20alert__date%2C%20SUM(alert__count)%20AS%20alert__count%2C%20confidence__cat%20FROM%20data%20WHERE%20iso%20%3D%20%27BOL%27%20AND%20alert__date%20%3E%3D%20%27${currentYear}-01-01%27%20AND%20alert__date%20%3C%3D%20%27${today.toISOString().split('T')[0]}%27%20AND%20confidence__cat%20%3D%20%27h%27%20GROUP%20BY%20alert__date%2C%20confidence__cat%20ORDER%20BY%20alert__date%20DESC` const file = await d3.json(url) const data = file.data. filter(i => i.confidence__cat == 'h'). map(i => ({ date: new Date(i.alert__date), count: i.alert__count })) const dataClean = Array.from( d3.rollup(data, v => d3.sum(v, d => d.count), d => d.date.getUTCMonth() + 1) ).map( i => {return ({year: currentYear, month: i[0], count: i[1]})} ).reverse() const f = await FileAttachment("viirs_historic@1.json").json() const historic = f.filter(d => d.year < currentYear) return historic.concat(dataClean) }32:Ta66,viewof viirsPlot = { const lineOptions = {x: 'month', y: 'count'} const viirsOptions = { z: 'year', stroke: d => d.year == currentYear ? colors.alerts : colors.loss, strokeOpacity: d => d.year == currentYear ? 1. : 1 - ((currentYear - d.year + 1) * .12), strokeWidth: d => d.year == currentYear ? 3 : 1.5, title: d => d3.format(".0f")(d.year) } const pointerOptions = { x: 'month', py: 'count', z: 'month', stroke: colors.lossRecent, strokeOpacity: .01, strokeWidth: 5, maxRadius: 100 } const dotOptions = { fill: colors.alerts, stroke: colors.alerts, strokeOpacity: .3, strokeWidth: 12, r: 5, title: d => `${d.count} focos de calor` } let plot_viirs, plot_pointer, plot_last if (cumulative) { plot_viirs = Plot.lineY(viirs_cum, { ...lineOptions, ...viirsOptions, curve: 'basis', }) plot_pointer = Plot.ruleX(viirs_cum, Plot.pointerX({...pointerOptions})) plot_last = Plot.dot(viirs_cum, Plot.selectLast({ ...lineOptions, ...dotOptions, })) } else { plot_viirs = Plot.lineY(viirs, { ...lineOptions, ...viirsOptions, curve: 'bump-x', }) plot_pointer = Plot.ruleX(viirs, Plot.pointerX({...pointerOptions})) plot_last = Plot.dot(viirs, Plot.selectLast({ ...lineOptions, ...dotOptions, })) } return Plot.plot({ width: width, height: 300, marginTop:0, marginBottom: 70, marginLeft: 0, marginRight: 50, y: { axis: 'right', tickSize: 0, ticks: 3, label: null, tickFormat: d => `${d / 1e3} mil` // tickFormat: d => d > 0 ? d == 8000 ? `${d / 1e3} mil` : (d / 1e3) : '' }, x: { axis: 'bottom', tickSize: 0, ticks: 5, label: null, tickPadding: 10, tickFormat: d => months[d], }, style: { color: colors.secondary }, marks: [ Plot.gridY({ ticks: 5, strokeOpacity: 1, strokeDasharray: "1,3" }), Plot.gridX({ ticks: 12, strokeOpacity: .5, strokeDasharray: "1,6" }), plot_viirs, plot_pointer, plot_last, Plot.text([`focos de calor de alta confianza por mes desde ${historicSince} en Bolivia`], { frameAnchor: 'bottom', lineHeight: 1.5, lineAnchor: 'bottom', dy: 45 }), Plot.text(['VIIRS via FIRMS y Global Forest Watch'], { frameAnchor: 'bottom', lineHeight: 1.5, lineAnchor: 'top', fillOpacity: .5, dy: 53 }) ] }) }33:[{"id":"c77e0b2c817764a4d87653d4c9f5673c0504b84966123be9b1695ab60a070fad2376ff16ea0fe3c50c5d9c04d0ddb344e57c0e80c38f7b336800b3a2aa7d14cd","href":"https://static.observableusercontent.com/files/c77e0b2c817764a4d87653d4c9f5673c0504b84966123be9b1695ab60a070fad2376ff16ea0fe3c50c5d9c04d0ddb344e57c0e80c38f7b336800b3a2aa7d14cd","name":"viirs_historic@1.json","type":"application/json","lastModified":1700397929640.697,"size":3479}] 2d:{"title":"Bolivia arde","cells":[{"id":2246,"value":"header = htl.html`

Bolivia arde

\n Bolivia arde\n el ${dateFormat.format(today)}\n

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1627,"value":"drawLines([\n cumulative ? `${summary.thisYear} focos de calor en ${currentYear}` : `${summary.thisMonth} focos de calor durante ${summary.lastMonth}`\n])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1820,"value":"html`\n\n\n${viewof cumulative}\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1442,"value":"html`\n

\n${crappyLegend}\n${viewof viirsPlot}\n

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":435,"value":"drawLines([\n \"el bosque arde desde hace muchos años\",\n `${d3.format('.0f')(totalLoss)} hectáreas perdidas en Bolivia entre 2000 y ${currentYear - 1}`\n])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1239,"value":"html`\n

\n ${coverLossPlot}\n ${barLegend}\n

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":605,"value":"viewof mapa = {\n\n let container = html`

`\n \n yield container\n \n const map = (container.value = new maplibregl.Map({\n boxZoom: true,\n pitch: 0,\n bearing: 0,\n container,\n // center: [-61.02038130366458, -17.327529231706976],\n center: [-64, -16.5],\n zoom: 5,\n style: \"https://basemaps.cartocdn.com/gl/dark-matter-nolabels-gl-style/style.json\",\n scrollZoom: true\n }))\n\n map.on('load', () => {\n\n map.addSource('baseline', baseline.source)\n map.addLayer(baseline.layer)\n\n map.addSource('loss', loss.source)\n map.addLayer(loss.layer)\n\n map.addSource('lossRecent', lossRecent.source)\n map.addLayer(lossRecent.layer)\n\n map.addSource('alerts', alerts.source)\n map.addLayer(alerts.layer)\n\n map.addSource('fires', fires.source)\n map.addLayer(fires.layer)\n\n map.addSource('labels', labels.source)\n map.addLayer(labels.layer)\n\n })\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2293,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":1477,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":1480,"value":"map legend","pinned":false,"hidden":false,"mode":"md"},{"id":1148,"value":"async function getCoverLoss() {\n \n const version = 'v20230502'\n const sql = `SELECT iso, umd_tree_cover_loss__year, SUM(umd_tree_cover_loss__ha) AS umd_tree_cover_loss__ha FROM data WHERE iso = 'BOL' AND umd_tree_cover_density_2000__threshold = 30 GROUP BY umd_tree_cover_loss__year, iso ORDER BY umd_tree_cover_loss__year, iso`\n const url = `https://data-api.globalforestwatch.org/dataset/gadm__tcl__iso_change/${version}/query/json?sql=${sql}`\n const response = await d3.json(url)\n return response.data\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1149,"value":"coverLoss = getCoverLoss()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1862,"value":"totalLoss = d3.rollup(coverLoss, v => d3.sum(v, d => d.umd_tree_cover_loss__ha))","pinned":false,"hidden":false,"mode":"ojs"},{"id":992,"value":"barLegend = {\n const categories = [\n {name: 'cobertura', year: 'en 2000', color: colors.baseline, w: 70},\n {name: 'pérdidas', year: `entre 2000 y ${currentYear - 2}`, color: colors.loss, w: 97},\n {name: 'pérdidas', year: `en ${currentYear - 1}`, color: colors.lossRecent, w: 97}, \n {name: 'alertas', year: `en ${currentYear}`, color: colors.alerts, w: 70}\n ]\n \n return html`\n

\n ${categories.map(c => {\n return `\n

${c.name}

${c.year}

`\n }).join(\"\")}\n

\n`\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1154,"value":"coverLossPlot = {\n const scaleOptions = {axis: null}\n const format = d3.format('.0f')\n return Plot.plot({\n height: 60,\n width: 200,\n x: {\n ...scaleOptions,\n },\n y: {\n ...scaleOptions,\n },\n marks: [\n Plot.barY(coverLoss, {\n x: 'umd_tree_cover_loss__year',\n y: 'umd_tree_cover_loss__ha',\n fill: d => d.umd_tree_cover_loss__year == currentYear - 1 ? colors.lossRecent : colors.loss,\n fillOpacity: .5,\n title: d => `${format(d.umd_tree_cover_loss__ha)} ha en ${d.umd_tree_cover_loss__year}`\n })\n ]\n })\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1484,"value":"general parameters","pinned":false,"hidden":false,"mode":"md"},{"id":2257,"value":"dateFormat = new Intl.DateTimeFormat('es-BO', {year: 'numeric', month: 'long', day: 'numeric'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":381,"value":"colors = ({\n main: '#131c1a',\n secondary: '#515a69',\n baseline: '#4b7364',\n loss: '#a3a8bf',\n lossRecent: '#797CFF',\n alerts: '#f57e31'\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1513,"value":"currentYear = 2023","pinned":false,"hidden":false,"mode":"ojs"},{"id":1493,"value":"map layers","pinned":false,"hidden":false,"mode":"md"},{"id":607,"value":"maplibregl = {\n const [module, styleURL] = await Promise.all([\n require(\"maplibre-gl@3.1.0\"),\n require.resolve(\"maplibre-gl@3.1.0/dist/maplibre-gl.css\")\n ]);\n \n const style = document.head.appendChild(\n html``\n );\n invalidation.then(() => style.remove());\n \n return module;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":716,"value":"baseline = ({\n source: {\n type: 'raster',\n tiles: [\n 'https://earthengine.google.org/static/hansen_2014/gfw_loss_tree_year_30_2014/{z}/{x}/{y}.png'\n ],\n tileSize: 256,\n attribution: \"Tree Cover (Hansen/UMD/Google/USGS/NASA)\",\n },\n layer: {\n id: 'baselineLayer',\n type: 'raster',\n source: 'baseline',\n paint: {\n \"raster-opacity\": .25,\n \"raster-contrast\": -.2,\n \"raster-saturation\": -.6,\n \"raster-hue-rotate\": 40\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":714,"value":"loss = ({\n source:{\n type: 'raster',\n tiles: [\n `https://tiles.globalforestwatch.org/umd_tree_cover_loss/latest/dynamic/{z}/{x}/{y}.png?end_year=${currentYear - 1}`\n ],\n tileSize: 256\n },\n layer: {\n id: 'lossLayer',\n type: 'raster',\n source: 'loss',\n paint: {\n \"raster-opacity\": 1.,\n \"raster-saturation\": -.6,\n \"raster-hue-rotate\": -105,\n \"raster-brightness-max\": .75\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":711,"value":"lossRecent = ({\n source: {\n type: 'raster',\n tiles: [\n `https://tiles.globalforestwatch.org/umd_tree_cover_loss/latest/dynamic/{z}/{x}/{y}.png?start_year=${currentYear - 1}`\n ],\n tileSize: 256\n },\n layer:{\n id: 'lossRecentLayer',\n type: 'raster',\n source: 'lossRecent',\n paint: {\n \"raster-opacity\": 1.,\n \"raster-contrast\": .3,\n \"raster-saturation\": -.15,\n \"raster-hue-rotate\": -95\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":709,"value":"alerts = ({\n source: {\n type: 'raster',\n tiles: [\n `https://tiles.globalforestwatch.org/umd_glad_sentinel2_alerts/latest/dynamic/{z}/{x}/{y}.png?start_date=${currentYear}-01-01`\n ],\n tileSize: 256,\n attribution: 'GLAD Forest Loss Alerts (UMD/GLAD)'\n },\n layer: {\n id: 'alertsLayer',\n type: 'raster',\n source: 'alerts',\n paint: {\n \"raster-contrast\": .5,\n \"raster-saturation\": -.2,\n \"raster-hue-rotate\": 40\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":706,"value":"labels = ({\n source: {\n type: 'raster',\n tiles: [\n 'https://a.basemaps.cartocdn.com/dark_only_labels/{z}/{x}/{y}.png'\n ],\n tileSize: 256\n },\n layer: {\n id: 'labels-layer',\n type: 'raster',\n source: 'labels',\n paint: {\n \"raster-opacity\": .8,\n }\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1496,"value":"fires","pinned":false,"hidden":false,"mode":"md"},{"id":1929,"value":"yearComparison = {\n if (viirsPlot){\n return yearComparisonPlot(viirsPlot, 90, true)\n } else {\n const referenceValue = viirsDomain * .12\n return yearComparisonPlot([\n {year: 2017, month:1, count: referenceValue},\n {year: 2018, month:1, count: referenceValue},\n {year: 2019, month:1, count: referenceValue},\n {year: 2020, month:1, count: referenceValue},\n {year: 2021, month:1, count: referenceValue},\n {year: 2022, month:1, count: referenceValue},\n {year: 2023, month:1, count: referenceValue}\n ], 90, false) \n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2018,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":2070,"value":"viirsDomain = cumulative ? Math.max(...viirs_cum.map(v => v.count)) : Math.max(...viirs.map(v => v.count))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2179,"value":"yearsDomain = [... new Set(viirs.map(v => v.year))]","pinned":false,"hidden":false,"mode":"ojs"},{"id":209,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":2044,"value":"viirs_cum = d3.rollups(\n viirs, \n (v) => d3.sum(v, (d) => d.count), \n (d) => d.year, \n (d) => d.month\n).map(([year, values]) => {\n const summed = d3.cumsum(values, d => d[1])\n const months = values.map(d => { return d[0] })\n const combined = d3.zip(months, summed)\n .map(([month, count]) => ({year, month, count}))\n\n return combined\n}).flat()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1811,"value":"today = new Date()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1630,"value":"summary = {\n const lastMonth = viirs[viirs.length - 1]\n return {\n thisYear: d3.rollup(viirs.filter(v => v.year == 2023), v => d3.sum(v, d => d.count)),\n thisMonth: lastMonth.count,\n lastMonth: new Intl.DateTimeFormat(\"es-BO\", {month: 'long'}).format(new Date(lastMonth.year, lastMonth.month - 1, 1))\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1523,"value":"historicSince = Math.min(...viirs.map(h => h.year))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1914,"value":"import {Plot} from \"@observablehq/pointer-z-1671\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1949,"value":"months = ({\n 1: 'enero',\n 2: 'febrero',\n 3: 'marzo',\n 4: 'abril',\n 5: 'mayo',\n 6: 'junio',\n 7: 'julio',\n 8: 'agosto',\n 9: 'septiembre',\n 10: 'octubre',\n 11: 'noviembre',\n 12: 'diciembre'\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1434,"value":"crappyLegend = html`\n

500 ? 245 : 150}px; color: ${colors.secondary}; position: absolute; margin: 35px 0 0 ${width > 500 ? 80 : 15}px; font-family: sans-serif\">\n

\n 500 ? .6 : .4}em; max-width: ${width > 500 ? 80 : 50}px; opacity: .8\">\n ${viirsPlot ? \"focos de calor en \" + months[viirsPlot[0].month] : \"focos de calor por mes en\"}\n \n 500 ? 2.2 : 1.6}em; font-weight: bold\">${currentYear}\n

\n ${\n yearComparison\n }\n

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":231,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":1787,"value":"viewof cumulative = Inputs.radio([false, true], {value: false, format: d => d ? \"acumulados\" : 'focos por mes'})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1498,"value":"text","pinned":false,"hidden":false,"mode":"md"},{"id":431,"value":"drawLines = (lines) => {\n\n return html`\n

\n ・\n ${lines.map(line => {return `${line}`})}\n ・\n

\n`\n}","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}