3e:null 3f:["$","title",null,{"children":"DANA 2024 Valencia | Xavi Giménez | Observable"}] 45:T868,{ let data = _.chain(all_stations) .reject((d) => _.isNil(d.precAcc)) .filter((d) => d.indicativo == selectedStation[0]) .value(); if (data.length === 0) return `No data for ${selectedStation[1]}`; // get top 5 plus 2024 let maxYears = _(data) .groupBy("year") .mapValues((d) => _.pick(_.last(d), ["precAcc", "plottedDate", "year"])) .sortBy("precAcc") .reverse() .take(5) .concat([ _.pick(_.last(_.filter(data, ["year", 2024])), [ "precAcc", "plottedDate", "year" ]) ]) .uniqBy("year") .value(); // add year with less cumulative rain maxYears = maxYears.concat( _(data) .groupBy("year") .mapValues((d) => _.pick(_.last(d), ["precAcc", "plottedDate", "year"])) .sortBy("precAcc") .take(1) .value() ); return Plot.plot({ title: `${selectedStation[1]}, València`, subtitle: "Precipitació acumulada diària (mm), 2009-2024", width: 800, height: 650, y: { grid: true, label: null, domain: [0, 1.1 * _.maxBy(data, "precAcc").precAcc], ticks: 12, tickFormat: (d) => d.toString() }, marks: [ Plot.axisX({ label: null, ticks: "year", tickSize: 28, tickPadding: -11, tickFormat: " %Y", textAnchor: "start" }), Plot.axisX({ label: null, ticks: "month", tickSize: 16, tickPadding: -11, tickFormat: " %b", textAnchor: "start" }), Plot.ruleY([0]), Plot.lineY(data, { x: "plottedDate", y: "precAcc", z: "year", stroke: (d) => (d.year == 2024 ? "#1434A4" : "#A7C7E7"), strokeWidth: (d) => (d.year == 2024 ? 3 : 1) }), Plot.text(maxYears, { x: "plottedDate", y: "precAcc", text: (d) => d.year.toString(), fontWeight: (d) => (d.year == 2024 ? "bold" : "bold"), textAnchor: "end", fill: "black", stroke: "white", textStroke: "white", textStrokeWidth: 3, fontSize: 11, dy: -10 }) ] }); }46:T9fd,

${estaciones.map((station) => { let data = _.chain(all_stations) .reject((d) => _.isNil(d.precAcc)) .filter((d) => d.indicativo == station[0]) .value(); if (data.length === 0) return html`

${station[1]}

No data

`; // get top 5 plus 2024 let maxYears = _(data) .groupBy("year") .mapValues((d) => _.pick(_.last(d), ["precAcc", "plottedDate", "year"])) .sortBy("precAcc") .reverse() .take(5) .concat([ _.pick(_.last(_.filter(data, ["year", 2024])), [ "precAcc", "plottedDate", "year" ]) ]) .uniqBy("year") .value(); // add year with less cumulative rain maxYears = maxYears.concat( _(data) .groupBy("year") .mapValues((d) => _.pick(_.last(d), ["precAcc", "plottedDate", "year"])) .sortBy("precAcc") .take(1) .value() ); return html`

${station[1]}

${ Plot.plot({ width: 390, height: 350, y: { grid: true, label: null, domain: [0, 1.1 * _.maxBy(data, "precAcc").precAcc], ticks: 5 }, marks: [ Plot.axisX({ label: null, ticks: "year", tickSize: 28, tickPadding: -11, tickFormat: " %Y", textAnchor: "start" }), Plot.axisX({ label: null, ticks: "3 months", tickSize: 16, tickPadding: -11, tickFormat: " %b", textAnchor: "start" }), Plot.ruleY([0]), Plot.lineY(data, { x: "plottedDate", y: "precAcc", z: "year", stroke: (d) => (d.year == 2024 ? "#1434A4" : "#A7C7E7"), strokeWidth: (d) => (d.year == 2024 ? 3 : 1) }), Plot.text(maxYears, { x: "plottedDate", y: "precAcc", text: (d) => d.year?.toString(), fontWeight: (d) => (d.year == 2024 ? "bold" : "bold"), textAnchor: "end", fill: "black", stroke: "white", textStroke: "white", textStrokeWidth: 3, fontSize: 11, dy: -10 }) ] }) }

` } )}

47:T6e8,data = { yield []; return; // api timespan limit is 6 months let dates = [ ["01-01", "06-30"], ["07-01", "12-31"] ]; let years = _.range(2009, 2025); let data, dataUrl; let dateStart = (y, d) => `${y}-${d}T00:00:00UTC`; let dateEnd = (y, d) => `${y}-${d}T23:59:59UTC`; let yearlyData = []; const sleepTime = 10000; for (const estacion of estaciones) { console.group(); console.log("//// Fetching data for ", estacion[1], estacion[0], "////"); for (const year of years) { let series = []; let acc = 0; let getYearlyData = async (i) => { dataUrl = await apiCall( dateStart(year, dates[i][0]), dateEnd(year, dates[i][1]), estacion[0] ); if (_.isEmpty(dataUrl)) { console.log("No data for", year); } else { data = ( await fetch(dataUrl.datos).then((response) => response.json()) ).map((d) => { return { ..._.pick(d, ["fecha", "indicativo", "prec"]), precFloat: parse(d.prec), precAcc: (acc += parse(d.prec)), year, date: new Date(d.fecha), // hacky. just set the same year so we draw multilines with same period of time when plotting plottedDate: new Date(new Date(d.fecha).setFullYear(1900)), station: estacion[0] }; }); series = [...series, ...data]; } }; console.log("Fetch data for", year); await getYearlyData(0); await sleep(sleepTime); await getYearlyData(1); await sleep(sleepTime); yearlyData = [...yearlyData, ...series]; } console.groupEnd(); } yield yearlyData; }48:T4b6,function apiCall(fechaini, fechafin, estacion, verbose = true) { return new Promise(function (resolve, reject) { var xhr = new XMLHttpRequest(); xhr.withCredentials = true; var dest = `https://opendata.aemet.es/opendata/api/valores/climatologicos/diarios/datos/fechaini/${fechaini}/fechafin/${fechafin}/estacion/${estacion}/?api_key=${api_key}`; xhr.open("GET", dest); xhr.setRequestHeader("Content-Type", "application/json"); xhr.setRequestHeader("cache-control", "no-cache"); xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (verbose) { //console.log("Got response " + xhr.responseText); console.log("Status " + xhr.status); } if (xhr.status != 200) { console.log("Error"); resolve({}); } let response = JSON.parse(xhr.responseText); if (response.estado == 404) { console.log("Error 404", response.descripcion); resolve({}); } resolve(response); } }; try { xhr.send(); } catch (e) { if (verbose) console.log("Error " + e); reject(e); } return "Doing GET on " + dest; }); }49:[{"id":"9a4df7360211404e43745aa9486ce5eb710e565a782c05f313a5fe812cb07dc94a81d669baddbc07d5ffe5b6bc66b7013bfbb0df9708d45a3472065dce313f75","href":"https://static.observableusercontent.com/files/9a4df7360211404e43745aa9486ce5eb710e565a782c05f313a5fe812cb07dc94a81d669baddbc07d5ffe5b6bc66b7013bfbb0df9708d45a3472065dce313f75","name":"all_stations.csv","type":"text/csv","lastModified":1731678076963.681,"size":7906656}] 43:{"id":"9d981ab8857a3bbd","slug":"dana-2024-valencia","title":"DANA 2024 Valencia","thumbnail":"1affe96460283286824c0640bfce51deacb7d0a717177871ba9c8ee114506cc9","access_level":"public","create_time":"$D2024-11-15T13:41:16.963Z","update_time":"$D2024-11-18T09:55:36.502Z","view_time":null,"first_public_time":"$D2024-11-15T15:06:41.845Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"3b37baced2fe95b2","login":"xavigimenez","name":"Xavi Giménez","avatar_url":"https://avatars-next.observableusercontent.com/af49fef2215148057dac87b5ed231ee5c6abab4b38611cc89da4a89b1e63e6d4","tier":"starter_2024","bio":"Interactive Data Journalist at The Economist"},"version":509,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"c659cc48420e349d","login":"xavigimenez","name":"Xavi Giménez","avatar_url":"https://avatars-next.observableusercontent.com/af49fef2215148057dac87b5ed231ee5c6abab4b38611cc89da4a89b1e63e6d4","tier":null,"bio":"Interactive Data Journalist at The Economist"}],"members":[{"type":"individual","id":"c659cc48420e349d","login":"xavigimenez","name":"Xavi Giménez","avatar_url":"https://avatars-next.observableusercontent.com/af49fef2215148057dac87b5ed231ee5c6abab4b38611cc89da4a89b1e63e6d4","tier":null,"role":"editor"},{"type":"team","id":"3b37baced2fe95b2","login":"xavigimenez","name":"Xavi Giménez","avatar_url":"https://avatars-next.observableusercontent.com/af49fef2215148057dac87b5ed231ee5c6abab4b38611cc89da4a89b1e63e6d4","tier":"starter_2024","role":"viewer"}],"comments":[{"id":"12856bd8954b487d","reply_to_id":null,"content":"Improve small multiples for mobile","create_time":"$D2024-11-18T09:55:58.644Z","update_time":"$D2024-11-18T09:56:29.027Z","resolved":false,"user":{"type":"individual","id":"c659cc48420e349d","login":"xavigimenez","name":"Xavi Giménez","avatar_url":"https://avatars-next.observableusercontent.com/af49fef2215148057dac87b5ed231ee5c6abab4b38611cc89da4a89b1e63e6d4","tier":null}}],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"DANA 2024 Valencia","cells":[{"id":0,"value":"# DANA 2024 Valencia\n\nCumulative daily rainfall data source: AEMET (https://opendata.aemet.es/)\n\n---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":298,"value":"viewof selectedStation = Inputs.select(estaciones, {\n label: \"Select an AEMET station:\",\n format: (d) => d[1],\n value: _.find(estaciones, (d) => d[0] == \"8337X\")\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":478,"value":"---\nAll weather stations:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":410,"value":"$46","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":182,"value":"---\n## Data retrieval","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":89,"value":"{\n if (data.length > 0) return \"Data pulled in\";\n else return \"Loading...\";\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":280,"value":"Run the cell below in order to fetch data for all AEMET stations in Valencia.\n\nThis cell is aimed to download data in bulk mode, so it yelds an empty array by default. To start fetching data (*once you get your api key from AEMET*), remove the return statement at the beginning of the cell's code.\n\nAEMET API endpoint is often sort of buggy, so it is recommended to fetch data one station at the time (or whatever chunk you prefer).\n\nOnce data is pulled in, the cell above will show the fetched data.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":31,"value":"$47","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":173,"value":"---\n## Util","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":16,"value":"api_key = \"YOUR_API_KEY\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"$48","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"parse = function (stringNumber) {\n if (stringNumber == undefined) return 0;\n // Replace comma with a dot if necessary\n const exampleNumber = new Intl.NumberFormat(\"es-ES\").format(1.1);\n if (exampleNumber.indexOf(\",\") > -1) {\n stringNumber = stringNumber.replace(\",\", \".\");\n }\n return parseFloat(stringNumber);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":227,"value":"estaciones = [\n \"8381X - Ademuz\",\n \"8072Y - Barx\",\n \"8270X - Bicorp\",\n \"8300X - Carcaixent\",\n \"8395X - Chelva\",\n \"8005X - Fontanars Dels Alforins\",\n \"8193E - Jalance\",\n \"8409X - Llíria\",\n \"8058Y - Miramar\",\n \"8058X - Oliva\",\n \"8283X - Ontinyent\",\n \"8325X - Polinyà De Xúquer\",\n \"8446Y - Sagunt/Sagunto\",\n \"8337X - Turís\",\n \"8309X - Utiel\",\n \"8414A - Valencia Aeropuerto\",\n \"8416X - Valencia, Upv\",\n \"8416 - València\",\n \"8416Y - València, Viveros\",\n \"8293X - Xàtiva\",\n \"8203O - Zarra\"\n].map((t) => t.split(\" - \"))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":294,"value":"all_stations = await FileAttachment(\"all_stations.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"all_stations","database":"$undefined"}],"files":"$W49","stdlib":"1"}} 44:"$43:body"