32:T644,{ const form = html` `; // Obtain form inputs const dateInput = form.date; const timeInput = form.time; // Bind form inputs --> views const updateExternal = () => { const date = dateInput.value; const time = timeInput.value; if (!date || !time) return; const t = moment(`${date}T${time}`).valueOf(); viewof tView.value = t; }; dateInput.oninput = updateExternal; timeInput.oninput = updateExternal; // Bind views --> form inputs const updateInternal = () => { const t = viewof tView.value; const mom = moment(t); dateInput.value = mom.format('YYYY-MM-DD'); timeInput.value = mom.format('HH:mm'); }; viewof tView.addEventListener('input', updateInternal); // Bidirectional bindings bind(form.slider, viewof tView); // Clean up on invalidation invalidation.then(() => { viewof tView.removeEventListener('input', updateInternal); }); // Initialise updateInternal(); return form; }33:T4ea,md`## About Lobelia Air **[Lobelia Air](https://aire-barcelona.lobelia.earth)** is an operational service which produces hourly, high-resolution maps of urban air pollution, including a recent-past reanalysis and a 48-hour forecast. The system is based on open data, which guarantees a versatile implementation for cities anywhere in the world. Currently operational are [Barcelona](https://aire-barcelona.lobelia.earth), [Madrid](https://aire-madrid.lobelia.earth) and [Amsterdam](https://amsterdam-lucht.lobelia.earth). Lobelia Air makes optimum use of accurate official measurements, traffic and population data, and meteorological observations, as well as state-of-the-art assimilation algorithms developed and validated by the [Royal Netherlands Meteorological Institute (KNMI)](https://knmi.nl/over-het-knmi/about) in the context of the [AirQast project](http://airqast.com). Analysis-ready data products are generated 24/7 for enrolled cities by [Lobelia Earth](https://lobelia.earth), and made available via an [API](http://airqast.com/#/api), as well as for citizens in the above cities. Based on the same algorithms and techniques, KNMI and Lobelia Earth are proud to present the **${datasetName}** dataset, freely available through this page. `34:T48f,download = md` ## Download The full dataset is available here: [barcelona_201801-201812_no2.nc](https://files.isardsat.co.uk/aq-retina-datasets/barcelona_201801-201812_no2.nc) (netCDF, ~ 10 GB). Some users reported problems downloading such a large file, so here are quarterly chunks of the same data: * [January-March 2018](https://files.isardsat.co.uk/aq-retina-datasets/barcelona_20180101-20180331_no2.nc) (2.5 GB) * [April-June 2018](https://files.isardsat.co.uk/aq-retina-datasets/barcelona_20180401-20180630_no2.nc) (2.6 GB) * [July-September 2018](https://files.isardsat.co.uk/aq-retina-datasets/barcelona_20180701-20180930_no2.nc) (2.6 GB) * [October-December 2018](https://files.isardsat.co.uk/aq-retina-datasets/barcelona_20181001-20181231_no2.nc) (2.6 GB) Some useful tools for netCDF visualisation and processing: [netCDF4](https://unidata.github.io/netcdf4-python/netCDF4/index.html) (a Python library), [Panoply](https://www.giss.nasa.gov/tools/panoply/) (a cross-platform data visualisation tool), [NCO](http://nco.sourceforge.net) (a Swiss-army knife for netCDF processing, which you can use e.g. to collate the quarterly chunks above). `35:T642,md`## License and credit This **${datasetName}** dataset is made available under the [Open Database License (ODbL)](https://lobelia.earth/odbl). Any rights in individual contents of the dataset are licensed under the [Database Contents License (DbCL)](https://lobelia.earth/dbcl). In a nutshell, this means that you are free: * *to share*: to copy, distribute and use the database * *to create*: to produce works from the database * *to adapt*: to modify, transform and build upon the database as long as you: * *attribute*: You must attribute any public use of the database, or works produced from the database, in the manner specified in the ODbL. For any use or redistribution of the database, or works produced from it, you must make clear to others the license of the database and keep intact any notices on the original database. * *share-alike*: If you publicly use any adapted version of this database, or works produced from an adapted database, you must also offer that adapted database under the ODbL. * *keep open*: If you redistribute the database, or an adapted version of it, then you may use technological measures that restrict the work (such as DRM) as long as you also redistribute a version without such measures. Please refer to the [full text of the ODbL](https://lobelia.earth/odbl). **Crediting the authors:** We require the following credit: *© Lobelia Earth & KNMI 2019.* You must also make it clear that the data is available under the Open Database Licence. This can be achieved by providing a "License" or "Terms" link which links to https://lobelia.earth/odbl. `36:T97a,function* createMap({ height = 300, invalidation, maxBounds } = {}) { const container = html`

`; yield container; // give the container dimensions const center = viewof centerView.value; const zoom = viewof zoomView.value; const map = new mapboxgl.Map({ container, center, zoom, maxBounds, // style: "mapbox://styles/mapbox/streets-v10" // style: "mapbox://styles/mapbox/streets-v10" style: "mapbox://styles/mapbox/empty-v8" }); // Bidirectional linking (see https://beta.observablehq.com/@mbostock/inline-inputs) // 1. from map to View const onUserPanZoom = () => { const { lng: lon, lat } = map.getCenter(); const zoom = map.getZoom(); viewof centerView.value = [lon, lat]; viewof zoomView.value = zoom; console.log({ lon, lat, zoom }); }; map.on("drag", onUserPanZoom); map.on("zoom", onUserPanZoom); // 2. from View to map const updateCenter = () => map.setCenter(viewof centerView.value); const updateZoom = () => map.setZoom(viewof zoomView.value); viewof centerView.addEventListener("input", updateCenter); viewof zoomView.addEventListener("input", updateZoom); invalidation.then(() => { map.remove(); viewof centerView.removeEventListener("input", updateCenter); viewof zoomView.removeEventListener("input", updateZoom); }); // Store a promise of the map on the container's value. // When the map is loaded, add a the base layer and resolve to the map itself container.value = new Promise((resolve) => { map.on("load", () => { map.addLayer({ id: "base", type: "raster", source: { type: "raster", tiles: [ "https://api.mapbox.com/styles/v1/mapbox/outdoors-v11/tiles/256/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibW9yZ2FuaGVybG9ja2VyIiwiYSI6Ii1zLU4xOWMifQ.FubD68OEerk74AYCLduMZQ" ], tileSize: 256, attribution: '© Lobelia Earth & KNMI 2019' }, paint: { "raster-saturation": -1 }, minzoom: 0, maxzoom: 22 }); resolve(map); }); }); }37:[] 30:{"title":"Hourly, street-level NO2 concentrations in Barcelona (2018)","cells":[{"id":0,"value":"md`# Hourly, street-level NO₂ concentrations in Barcelona (2018)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":61,"value":"md`\nThe **${datasetName}** dataset is free to use. See the [**Download**](#download) section below.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":626,"value":"md`## Explore the dataset`","pinned":false,"hidden":false,"mode":"ojs"},{"id":365,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":678,"value":"{\n const form = html`\n \n `;\n bind(form.speed, viewof speedView);\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":64,"value":"map1 = createMap({ height: 700, invalidation, maxBounds: bcnBounds })","pinned":false,"hidden":false,"mode":"ojs"},{"id":630,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":566,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":574,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":1069,"value":"md`## Acknowledgements\n\nContains modified Copernicus Service information (2018).`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1053,"value":"md`## Contact us\n\nFor suggestions, further details, etc. please contact us at: [info@lobelia.earth](mailto:info@lobelia.earth).\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":995,"value":"html`\n

\n
\n
\n
\n

\n Made with 💚 in Barcelona.
\n November 2019.\n