2d:null 2e:["$","title",null,{"children":"On Data and Design | Office for Statistics and Data of the Canton of Zurich | Observable"}] 33:T4dd,notes.md`Unfortunately, the published data usually looks like this playground. Built with the best intentions, but not open, not accessible, not usable and above all: NOT PLAYABLE.

Many times, this barriers are unnecessary or from a long analog time ago. Or they are just not target oriented. One example for the latter ist the Open Data Licence [NonCommercialAllowed-CommercialWithPermission-ReferenceRequired](https://opendata.swiss/de/dataset/?res_rights=NonCommercialAllowed-CommercialWithPermission-ReferenceRequired).

Almost half of the datasets on [opendata.swiss](https://opendata.swiss/de) have this licence. So if [Darjan from Superdot](https://www.superdot.studio/wir-sind) wants to make a Vis with this data, he has to ask for permission, if he uses the data for commercial purposes. I am pretty sure he will get the permission. But asking costs time, both Darjan and the administration. So Darjan even pays twice for it, with his time and with his taxes. And imagine a journalist who wants to publish an article. She/they/he doesn't have time to wait for a week or more to get the persmission. As i said: i am sure, the decision for this licence was made with the best intentions. So what went wrong? `34:T460,notes.md` I copied this from the CARE principles for indigenous data governance. However, the core values are transferable to data governance in general: Collective benefit: - use data for inclusive development and innovation. - Use data to foster citizen engagement and improve governance.
Authority to Control - Recognizing rights and interests of the public. the public has rights and interests in the collected data and the use of data. - a2 Data for governance - a3 Governance of Data

Responsibility
Those working with data have a responsibility to share the data and the outcomes generated with it with the public. The data should be used for - positive relationships - For expanding capability and capacity.
Peoples rights and wellbeing should be the primary concern. - e1 For minimizing harm and maximizing benefit - e2 For justice
Source: [CARE Principles for Indigenous Data Governance](https://static1.squarespace.com/static/5d3799de845604000199cd24/t/5d79c383e904c741c9e9cd86/1568260995760/CARE+Principles+for+Indigenous+Data+Governance_FINAL_Sept+06+2019.pdf) `35:T1455,viewof parking = { let container = DOM.element("div", { id: "map", class: "slide slide--small", style: `width:${width}px;height:${350}px`, alt: "Parkhäuser Basel-Stadt" }); yield container; const map = L.map("map", { minZoom: 9, maxZoom: 17 }); //.addControl(new customControl1()); console.log("mapsetview"); let zoomT = 0; let clicked = {}; if (width < 600) { zoomT = 8; } else { zoomT = zoomOrg; } map.setView([latOrg, lngOrg], zoomT); //OpenStreetMap_BlackAndWhite //http://a.tile.stamen.com/toner/${z}/${x}/${y}.png //https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png //https://{s}.tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png //https://stamen-tiles-{s}.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.jpg L.tileLayer( "https://stamen-tiles-{s}.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.jpg", { opacity: 0.8, attribution: 'Map tiles by Stamen Design, under CC BY 3.0. Data by OpenStreetMap, under CC BY SA.

' } ).addTo(map); var svgLayer = L.svg(); svgLayer.addTo(map); var svg = d3.select("#map").select("svg").attr("pointer-events", "auto"); var g = d3.select("#map").select("svg").select("g"); g.attr("class", " leaflet-zoom-hide"); // offizieller ZHweb Layer des GIS //(sehr langsam) /* L.tileLayer.wms('https://wms.zh.ch/ZHWEB', { maxZoom: 14, layers: 'Geometrie' }).addTo(map); */ function projectPoint(x, y) { var point = map.latLngToLayerPoint(new L.LatLng(y, x)); this.stream.point(point.x, point.y); } var transform = d3.geoTransform({ point: projectPoint }); var path = d3.geoPath().projection(transform); var pathNull = d3.geoPath().projection(null); var circles = svg .selectAll("circle.circles") .data(parkplaetze.records) .enter() .append("circle") .attr("class", "circles") //.attr("pointer-events", "none") .style("stroke", "white") .style("stroke-width", "1") .style("fill-opacity", 0.6) .style("fill", function (d) { return colorP(d.fields.free); }) .attr("r", 1.4 * zoomT) .on("mouseover", function (event, d) { svg .append("g") .attr("id", "mouseText") .attr("pointer-events", "none") .append("text") .attr("x", event.layerX) .attr("y", event.layerY) .text(d.fields.name + ": " + d.fields.description); }) .on("mouseout", function (event, d) { d3.select("#mouseText").remove(); }); //Geojson function update() { console.log("update"); //featureElement.attr("d", path); circles .attr("transform", function (d) { console.log(d); if (typeof d.fields.geo_point_2d !== "undefined") { return ( "translate(" + map.latLngToLayerPoint(d.LatLng).x + "," + map.latLngToLayerPoint(d.LatLng).y + ")" ); } }) .attr("r", 16); } update(); map.on("zoomend", function () { zoomT = map.getZoom(); if (zoomT >= 13) { d3.selectAll(".circles") .attr("r", 16) .attr("cursor", "pointer") .attr("pointer-events", "all") .on("mouseover", function () { d3.select(this).style("fill-opacity", 1); }) .on("mouseout", function () { d3.select(this).style("fill-opacity", 0.6); }) .on("click", function (event, d) { clicked = d; }); update(); } else { update(); d3.selectAll(".circles") .attr("r", 1.4 * zoomT) .style("fill-opacity", 0.6) .attr("pointer-events", "none"); } }); update(); map.on("zoomend", function () { zoomT = map.getZoom(); if (zoomT >= 13) { d3.selectAll(".circles") .attr("r", 16) .attr("cursor", "pointer") .attr("pointer-events", "all") .on("mouseover", function () { d3.select(this).style("fill-opacity", 1); }) .on("mouseout", function () { d3.select(this).style("fill-opacity", 0.6); }) .on("click", function (event, d) { clicked = d; }); } else { d3.selectAll(".circles") .attr("r", 1.4 * zoomT) .style("fill-opacity", 0.6) .attr("pointer-events", "none"); } }); function resetZoom() { map.setView([latOrg, lngOrg], zoomOrg); //d3.selectAll('.gemeinde').style('fill-opacity', 0.3); } return Object.assign(container, { value: { zoomT }, onmousemove: (event) => { event.currentTarget.value = { zoom: map.getZoom(), clickedPlace: clicked }; event.currentTarget.dispatchEvent(new CustomEvent("input")); }, onclick: (event) => { event.currentTarget.value = { zoom: map.getZoom(), clickedPlace: clicked }; event.currentTarget.dispatchEvent(new CustomEvent("input")); } }); }36:[{"id":"5ce547f3bce2f3602fc7f8a44e481f7816d08a272de1509ff76e47652e64e7f0e582fe97babd04c57ba99fa23e80fe97f72abe7d3abea4495b8622dda10e760f","href":"https://static.observableusercontent.com/files/5ce547f3bce2f3602fc7f8a44e481f7816d08a272de1509ff76e47652e64e7f0e582fe97babd04c57ba99fa23e80fe97f72abe7d3abea4495b8622dda10e760f","name":"playground_2474921b.jpg","type":"image/jpeg","lastModified":1630072543530.817,"size":105283},{"id":"e9fc20b766ecbe8c749f43705d9175862dc1e6f90d3a96e600f207ec8c6119cfc9357c6ecff4c0b3839e968ed7f19490bfcdf5033a1855f579dad437929f1187","href":"https://static.observableusercontent.com/files/e9fc20b766ecbe8c749f43705d9175862dc1e6f90d3a96e600f207ec8c6119cfc9357c6ecff4c0b3839e968ed7f19490bfcdf5033a1855f579dad437929f1187","name":"Bildschirmfoto 2021-08-31 um 11.13.21.png","type":"image/png","lastModified":1630401219637.599,"size":635243},{"id":"82b8c28517563bc5e8a06331a646b1b21c70638ba312a52dd3428400fc027a11f2ce61612e9af2baf3a3ad0e59b796b522e87923e86b49c818ec4f4bcbbdcc51","href":"https://static.observableusercontent.com/files/82b8c28517563bc5e8a06331a646b1b21c70638ba312a52dd3428400fc027a11f2ce61612e9af2baf3a3ad0e59b796b522e87923e86b49c818ec4f4bcbbdcc51","name":"arrival.png","type":"image/png","lastModified":1630568405690.688,"size":712824},{"id":"66d8ba8af4e5d03361901b3d7e2e0dde0998826d0b50358c7e5cfcfd943c1fd6d9917095e1f4494c7fd158bfd7e7476c7ae1b186c4c184c20370facd7b79fdf2","href":"https://static.observableusercontent.com/files/66d8ba8af4e5d03361901b3d7e2e0dde0998826d0b50358c7e5cfcfd943c1fd6d9917095e1f4494c7fd158bfd7e7476c7ae1b186c4c184c20370facd7b79fdf2","name":"BEVOELKERUNG_HA_F.csv","type":"text/csv","lastModified":1629804881313.486,"size":4088228},{"id":"1277360a7f12e75b2a17c8cb102f979f6f1079c17dd35dbf46650953c28277517692e48b4797338c5e9a19c03719ec4d02f46d3f170c52253f454d9969843cf3","href":"https://static.observableusercontent.com/files/1277360a7f12e75b2a17c8cb102f979f6f1079c17dd35dbf46650953c28277517692e48b4797338c5e9a19c03719ec4d02f46d3f170c52253f454d9969843cf3","name":"usercentereddatadesign.png","type":"image/png","lastModified":1630048185964.615,"size":1315952}] 31:{"id":"eaabf71d18063534","slug":"ondatadesign","title":"On Data and Design","thumbnail":"25acd8d4e998685861dad2a4cf879e6a8be67037bf1ecf716c947a6eba030333","access_level":"public","create_time":"$D2021-08-23T08:16:08.628Z","update_time":"$D2021-09-28T08:56:12.140Z","view_time":null,"first_public_time":"$D2021-08-23T08:19:26.144Z","has_unpublished_edits":null,"fork":{"id":"82350c252deafe28","slug":"slides-usage","title":"Using @visnup/slides","owner":{"id":"31b136fdb993b00a","login":"visnup","name":"Visnu Pitiyanuvath"}},"stars":1,"starred":false,"owner":{"type":"team","id":"4b23743d6fe05d13","login":"statistikzh","name":"Office for Statistics and Data of the Canton of Zurich","avatar_url":"https://avatars-next.observableusercontent.com/61364635cd5db7a914727e7625ac41daa90fedeba239e3d2ce93b57a9ad3bce9","tier":"pro"},"version":1230,"publish_version":1230,"role":null,"authored":false,"authors":[{"type":"individual","id":"37f1612f224a0555","login":"mmznrstat","name":"Matthias Mazenauer","avatar_url":"https://avatars-next.observableusercontent.com/ef3d946ccf160cca48b7f42bef702f21fe993881f97ef1654f4d43be2e36569d","tier":null}],"members":[{"type":"individual","id":"37f1612f224a0555","login":"mmznrstat","name":"Matthias Mazenauer","avatar_url":"https://avatars-next.observableusercontent.com/ef3d946ccf160cca48b7f42bef702f21fe993881f97ef1654f4d43be2e36569d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"e0c135b26987fa98","slug":"presentations","title":"Presentations","owner":{"id":"4b23743d6fe05d13","login":"statistikzh","name":"Office for Statistics and Data of the Canton of Zurich"}},"type":"notebook","body":{"title":"On Data and Design","cells":[{"id":0,"value":"# On Data and Design","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"logo","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1153,"value":"Presentation at the [«On Data And Design» MeetUp](https://www.meetup.com/de-DE/ondataanddesign-Switzerland/events/279586408/) on September 2.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"### Abstract \nI will talk about the need for data transparency of government agencies and how government agencies can enhance the accessibility of data so that people like Diana and Matteo can do their important work. I will share my own experience in advocating open government data and the obstacles and challenges i face in my daily work.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":532,"value":"md`### How To \nPress the ... in the top right corner (next to the \t🖤), then go to View -> View in fullscreen. Use the arrows to navigate`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"md`### Acknowledgements\nThank you [Mike Bostock](https://observablehq.com/@mbostock) et al. for [d3.js](https://d3js.org/) and [Observable](https://observablehq.com/). I am eternally grateful 💙\n\nThanks to [@visnup](https://observablehq.com/@visnup) for the great Slides Template!\n\nhttps://observablehq.com/@visnup/slides\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"keyBindings","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":177,"value":"slide.html` $\"Open$ `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":372,"value":"slide.html` $\"Titel\"$ `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1068,"value":"notes.md`Welcome and thx [Darjan](https://www.superdot.studio/wir-sind) for the great opportunity to talk about open data and User Centered Data Desgin: how and why. \n\nOpen by default is mandatory for all federal agencies. This means that data must be published as open data, as long as the data is not protected by law (most data on a personal level, for example your tax records). `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":651,"value":"slide.html` $\"Titel\"$ `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1073,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1084,"value":"slide.html` $\"Titel\"$ \n\n

\nSource: The Code behind Arrival\n

\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1092,"value":"notes.md`Often, the problem is lack of mutual understanding, translation problems. Like in the movie Arrival that, by the way, has some great data visuals in it. This is why [Diana's](https://neuland21.de/team/diana-krebs/) and [Matteo's](https://matteomoretti.com/) work and the work of you all as intermediaries, is so important.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":401,"value":"slide.html`\n\n

21st century public servants

\n
\n $\"engage\"$ \n
\n

Engage with your users!

\n
\n

\nSource: 21st Century Public Service\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1098,"value":"notes.md`What can the public administration do?
To make it easier for Diana and Matteo and you all, the public administration has to become [«21st century public servants»](https://21stcenturypublicservant.wordpress.com/) and engage with their customers and users, with the people. \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":649,"value":"slide.html`\n

We need to make it easy
to play with data,

\n $\"engage\"$ \n
\n

because we love to play!

\n
\n

\nRoland_TR-808_&_909.jpg: Brandon Danielderivative work: Clusternote, CC BY-SA 2.0, via Wikimedia Commons\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1102,"value":"notes.md`We need to make it easy to play with data. Because we love to play. We need to make it easy to be creative with data. We need to democratize the use and the understanding of data.
\n
\n\nLike the Roland TR 808 revoluzionized music production, open data helps to transform public administrations. We can discuss the quality of the music created. Sure, not everything was great. But the democratization of data (and music) opens a huge potential.
\n
\n\nWhat potential? How? and Why User Centered Data Design?\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":399,"value":"slide.md`### Why User-Centered Data Design?

\n## Because we CARE
\n- **C**ollective Benefit\n- **A**uthority\n- **R**esponsibility\n- **E**thics
\n
\n\n

\nSource: [CARE Principles for Indigenous Data Governance](https://static1.squarespace.com/static/5d3799de845604000199cd24/t/5d79c383e904c741c9e9cd86/1568260995760/CARE+Principles+for+Indigenous+Data+Governance_FINAL_Sept+06+2019.pdf)

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":444,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":460,"value":"slide.md`### How to design data user-friendly?
\n
\n## Be FAIR
\n- **F**indable\n- **A**ccessible\n- **I**nteroperable\n- **R**eusable
\n
\n\n

\nSource: [FAIR Principles](https://www.go-fair.org/fair-principles/)\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1140,"value":"notes.md`\n#### Findable
\nThe first step in (re)using data is to find them. Metadata and data should be easy to find for both humans and computers. Machine-readable metadata are essential for automatic discovery of datasets and services.
\n
\n#### Accessible
\nOnce the user finds the required data, she/he/they need to know how they can be accessed, possibly including authentication and authorisation.
\n
\n#### Interoperable
\nThe data usually need to be integrated with other data. In addition, the data need to interoperate with applications or workflows for analysis, storage, processing and publication.
\n
\n#### Reusable
\nThe ultimate goal of FAIR is to optimise the reuse of data. To achieve this, metadata and data should be well-described so that they can be replicated and/or combined in different settings.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":414,"value":"slide.md`### A good way to know if your data is FAIR:
\n
\n## Use your own data!\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1115,"value":"## Import Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1120,"value":"md`### from github`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1125,"value":"datenGithub = d3.csv(\n \"https://raw.githubusercontent.com/openZH/bathing_water_quality_ZH/master/data/bathing_water_quality_ZH.csv\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":635,"value":"md`### from our Server`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":622,"value":"datenServer = d3.csv(\n \"https://www.web.statistik.zh.ch/ogd/data/ojuga/KANTON-ZUERICH_jugendstrafrechtspflege_delikte_verurteilungen.csv\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":641,"value":"Inputs.table(datenServer)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":570,"value":"import { karte as meineKarte } with { myData as data } from \"@statistikzh/vorlage-fur-karten-mit-daten-aus-dem-gemeindeportrat\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":582,"value":"meineKarte","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":701,"value":"slide.html(\"small\")`\n

and do the hard work for your users

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":571,"value":"url = \"https://www.web.statistik.zh.ch/ogd/data/KANTON_ZUERICH_606.csv\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":588,"value":"pathMaps = \"https://raw.githubusercontent.com/statistikZH/Ressources_Maps/master/data/\"+jahr+\"/\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":573,"value":"rawData = d3.text(url)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":575,"value":"semikolonParser = d3.dsvFormat(\";\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":577,"value":"myData = semikolonParser.parse(rawData)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":589,"value":"mapData = d3.json(\n pathMaps +\n \"GemeindeGrosseSeeOhneExklave_gen_epsg2056_F_KTZH_\" +\n jahr +\n \".json\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":230,"value":"y = d3.scaleLinear()\n .domain(d3.extent(ha_Pers, d => +d.GKODN))\n .range([heightMap,0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":199,"value":"widthMap = 300;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":236,"value":"heightMap = widthMap*diffy/diffx","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"diffx = d3.extent(ha_Pers, d => +d.GKODE)[1]-d3.extent(ha_Pers, d => +d.GKODE)[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":203,"value":"diffy = d3.extent(ha_Pers, d => +d.GKODN)[1]-d3.extent(ha_Pers, d => +d.GKODN)[0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":253,"value":"o = d3.scaleLinear()\n //.base(2)\n .domain([0,d3.max(ha_Pers, d=>+d.PERS_N)])\n .range([0,180])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":726,"value":"colorScale = d3\n .scaleSequential(d3.interpolateWarm)\n .domain([0, d3.max(ha_Pers, (d) => +d.PERS_N)])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":591,"value":"jahr = 2020","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":192,"value":"x = d3.scaleLinear()\n .domain(d3.extent(ha_Pers, d => +d.GKODE))\n .range([0,widthMap])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":971,"value":"slide.md`### Findable Data:\n## Some Data Portals in Switzerland
\n
\n[Open Data Schweiz](https://opendata.swiss/de)
\n[Open Data Basel-Stadt](https://data.bs.ch/pages/home/?flg=de)
\n[Open Data Kanton Zürich](https://www.zh.ch/de/politik-staat/opendata.html?keyword=ogd#/home)
\n[Open Data Kanton Thurgau](https://data.tg.ch/pages/start/)
\n[Open Data Stadt Zürich](https://data.stadt-zuerich.ch/)
\n\n
\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":892,"value":"slide.md`\n## Use Open Data Portals
\nand make the code FAIR, too\n\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":887,"value":"slide.html` $\"Titel\"$ `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":844,"value":"{\n const node = slide.html(\"small\")`\n

Free parking lots in Basel on ${parkplaetze_1.records[0].now}

${d3.timeParse(\"%Q\")(now).toLocaleString(undefined, {\n hour: \"numeric\",\n minute: \"numeric\",\n second: \"numeric\"\n })}\n\n
\nSource: Datenportal Basel Stadt\n
\n\n `;\n\n return node;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1019,"value":"parkplaetze_1 = {\n while (true) {\n yield (\n await fetch(\n \"https://data.bs.ch/api/records/1.0/search/?dataset=100088&q=&sort=published&facet=title&facet=published&facet=name\"\n )\n )\n .json()\n .then(function (data) {\n data.records.forEach(function (d) {\n d.now = d3\n .utcParse(\"%Y-%m-%dT%H:%M:%S%Z\")(d.record_timestamp)\n .toLocaleString(undefined, {\n weekday: \"long\",\n month: \"short\",\n day: \"numeric\",\n hour: \"numeric\",\n minute: \"numeric\",\n second: \"numeric\"\n });\n d.LatLng = {};\n d.LatLng.lat = +d.fields.geo_point_2d[0];\n d.LatLng.lng = +d.fields.geo_point_2d[1];\n });\n return data;\n });\n await Promises.delay(60000);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":776,"value":"parkplaetze = d3\n .json(\n \"https://data.bs.ch/api/records/1.0/search/?dataset=100088&q=&sort=published&facet=title&facet=published&facet=name\"\n )\n .then(function (data) {\n data.records.forEach(function (d) {\n d.now = d3\n .utcParse(\"%Y-%m-%dT%H:%M:%S%Z\")(d.record_timestamp)\n .toLocaleString(undefined, {\n weekday: \"long\",\n month: \"short\",\n day: \"numeric\",\n hour: \"numeric\",\n minute: \"numeric\",\n second: \"numeric\"\n });\n d.LatLng = {};\n d.LatLng.lat = +d.fields.geo_point_2d[0];\n d.LatLng.lng = +d.fields.geo_point_2d[1];\n });\n return data;\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":838,"value":"legend({\n color: colorP,\n title: \"Freie Parkplätze\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":783,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":895,"value":"slide.html(\"small\")`\n
\n
And then: have fun!
\n
\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"ha_Pers_raw = FileAttachment(\"BEVOELKERUNG_HA_F.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":280,"value":"ha_Pers2 = ha_Pers_raw.filter(\n (el) =>\n +el.GKODE > 2673801 &&\n +el.GKODN > 1241735 &&\n +el.GKODE < 2695391 && +el.GKODN < 1256091\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":741,"value":"ha_Pers = ha_Pers_raw.filter(\n (el) =>\n +el.GKODE > 2678801 &&\n +el.GKODN > 1244735 &&\n +el.GKODE < 2692391 &&\n +el.GKODN < 1250091\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":725,"value":"legend({\n color: colorScale,\n title: \"Anzahl Personen pro ha\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":353,"value":"chartart = {\n //wir bereiten wieder eine Leinwand vor:\n const svg = d3\n .create(\"svg\")\n .attr(\"viewBox\", [0, 0, widthMap, heightMap])\n .style(\"background-color\", \"RebeccaPurple\");\n svg.append(\"g\").attr(\"class\", \"slide\");\n let rect = svg.selectAll(\"rect\").data(ha_Pers);\n const rW = 2;\n rect\n .enter()\n .append(\"rect\")\n .attr(\"width\", (d) => Math.sin(now / 1000) * rW)\n .attr(\"height\", rW)\n .style(\"fill\", (d) => (+d.PERS_N > 0 ? colorScale(+d.PERS_N) : \"none\"))\n .style(\"stroke\", \"black\")\n .style(\"stroke-width\", 0.2)\n .style(\"stroke-opacity\", 0.4)\n .style(\"fill-opacity\", 0.7)\n .attr(\n \"transform\",\n (d) =>\n \"translate(\" +\n x(+d.GKODE) +\n \",\" +\n y(+d.GKODN) +\n \")rotate(\" +\n //Math.sin(now / 1000) *\n o(+d.PERS_N) +\n \",\" +\n rW / 2 +\n \",\" +\n rW / 2 +\n \")\"\n );\n\n return svg.node();\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"slide.html`\n

We need to be FAIR,
so 👉you can CARE

Listen to the users of your data
engage with the public
first design the data, then the information
use your own data

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":497,"value":"slide.md`# Thank you for your attention\n(Re)Use ♻
\n[github.com/statistikZH](https://github.com/statistikZH)
\n[github.com/openZH](https://github.com/openZH)
\n[observablehq.com/@statistikzh](https://observablehq.com/@statistikzh?tab=notebooks)
\n
\nConnect 🤝
\nTwitter: [@statistik_zh](https://twitter.com/statistik_zh) [@opendatazh]( https://twitter.com/opendatazh) [@mmznr](https://twitter.com/mmznr)
\n[Linkedin](https://ch.linkedin.com/in/matthias-mazenauer-7303428a)\n\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":691,"value":"getData = {\n //wir bereiten wieder eine Leinwand vor:\n const svg = d3.create(\"svg\").attr(\"viewBox\", [0, 0, width, 1]);\n svg.append(\"g\").attr(\"class\", \"slide\");\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":545,"value":"Further Reading:\n[No metadata, no future](https://opendatabeer.files.wordpress.com/2018/04/slides_nometadatanofuture_mazenauer.pdf)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":997,"value":"## Just some Parameters","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":791,"value":"lngOrg = 7.6","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":792,"value":"latOrg = 47.56","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":794,"value":"zoomOrg = 13","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":785,"value":"customControl1 = L.Control.extend({\n options: {\n position: \"topright\"\n },\n\n onAdd: function (map) {\n let container = L.DomUtil.create(\n \"div\",\n \"leaflet-bar leaflet-control leaflet-control-custom\"\n );\n container.innerHTML = \"Back to Basel\";\n container.style.backgroundColor = \"white\";\n container.style.padding = \"5px\";\n\n container.onclick = function () {\n map.setView([latOrg, lngOrg], zoomOrg);\n d3.selectAll(\".image\").remove();\n };\n\n return container;\n }\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":820,"value":"colorP = d3\n .scaleSequential(d3.interpolateWarm)\n .domain([0, d3.max(parkplaetze.records, (d) => +d.fields.free)])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1003,"value":"## And some style sheets (sorry [Eric Meyer](https://meyerweb.com/eric/css/), it is a mess)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":779,"value":"leaflet = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"style","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"stil","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1160,"value":"## Imports","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":118,"value":"import { slide, notes, style, keyBindings } from '@visnup/slides'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":733,"value":"import { legend, swatches } from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"import { style as stil, dataDownload, logo } from \"@statistikzh/shared-imports\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":986,"value":"## Libraries","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":580,"value":"d3 = require(\"d3@v7\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":781,"value":"L = require(\"leaflet\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 32:"$31:body"