2e:null 2f:["$","title",null,{"children":"ixmaps - COVID-19 weekly new cases and fatalities - last 20 weeks | gjrichter | Observable"}] 34:T4b5,theme = () => { return { "layer": "World Mercator", "field": fields_56, "field100": "", "style": { "type": "CHART|SYMBOL|SEQUENCE|PLOT|LINES|AREA|LOLLIPOP|BOX|GRID|COLOR|DIFFERENCE|SUM|FIXSIZE|NOLEGEND", "colorscheme": [ "55", "rgba(200,150,150,1)", "rgba(200, 0, 90,1)"], "fillopacity": "0.3", "shadow": "false", "dbtable": "CONFIRMED", "datacache": "false", "lookupfield": "Lat|Long", "symbols": [ "circle"], "units": "", "label": label_56, "xaxis": xaxis_56, "normalsizevalue": "2", "scale": "0.2", "rangescale": "1", "minvalue": "0", "maxvalue": "auto", "align": "23right", "linewidth": "15", "bordercolor": "none", "boxopacity": "0.01", "titlefield": "Country/Region", "valuescale": "1", "valuedecimals": "0", "name": "new_cases_curves_1", "title": "COVID-19 - new cases/day
last 56 days", "snippet": "fonte: JHU CCSE" } } }35:T4df,theme_f = () => { return { "layer": "World Mercator", "field": fields_56_f, "field100": "", "style": { "type": "CHART|SYMBOL|SEQUENCE|PLOT|LINES|LOLLIPOP|BOX|GRID|RIGHT|TITLE|COLOR|DIFFERENCE|SUM|FIXSIZE|NOLEGEND", "colorscheme": [ "55", "rgba(150,150,150,1)", "rgba(50, 50, 50,1)"], "fillopacity": "0.3", "shadow": "false", "dbtable": "FATALITIES", "datacache": "false", "lookupfield": "Lat|Long", "symbols": [ "circle"], "units": "", "label": label_56_f, "xaxis": xaxis_56_f, "normalsizevalue": "2", "scale": "0.2", "rangescale": "1", "minvalue": "0", "maxvalue": "auto", "align": "23right", "linewidth": "5", "bordercolor": "none", "boxopacity": "0", "titlefield": "Country/Region", "titleupper": "1:10000000", "textcolor": "rgba(200, 0, 90,1)", "name": "new_cases_curves_2", "title": "COVID-19 - new cases/day
last 56 days", "snippet": "fonte: JHU CCSE" } } }36:T45d,project = () => { return { "$schema": "https://gjrichter.github.io/ixmaps/schema/ixmaps/v1.json", "map": { "map": "../../maps/svg/maps/generic/mercator.svg", "attribution": "iXMaps", "basemap": "ArcGIS - Light Gray Base", "legend": "

COVID-19
new cases / fatalities
last 20 weeks

data: 2019 Novel Coronavirus COVID-19 (2019-nCoV) Data Repository by Johns Hopkins CSSE

last update: "+actual_date+"

", "item": "", "scaleParam": { "objectScaling": "1.7", "normalSizeScale": "55000000", "dynamicScalePow": "2" }, "options": { "featurescaling": "dynamic", "objectscaling": "dynamic", "flushChartDraw": "50000", "mapopacity": "1", "basemapopacity": "1" }, "center": { "lat": "50.064191736659104", "lng": "12.94189453125" }, "zoom": "5" }, "themes": [ theme(), theme_f() ], } }37:[] 32:{"id":"63c843c4ab61e971","slug":"ixmaps-covid-19-weekly-new-cases-and-fatalities-last-20-week","title":"ixmaps - COVID-19 weekly new cases and fatalities - last 20 weeks","thumbnail":"61b833f240292cfa521d77b7af4060be57ca16c9d2e1ad480472358360b408fc","access_level":"public","create_time":"$D2021-11-03T07:51:08.846Z","update_time":"$D2021-11-03T09:08:09.420Z","view_time":null,"first_public_time":"$D2021-11-03T09:02:47.946Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"ab0359f3bbecf78a","login":"gjrichter","name":"","avatar_url":"https://avatars-next.observableusercontent.com/1dd94096da79a76babfe37a3431edc30377043a898592a3437e913920b189ed3","tier":"starter_2024"},"version":792,"publish_version":792,"role":null,"authored":false,"authors":[{"type":"individual","id":"921009d8ff1c586f","login":"gjrichter","name":"","avatar_url":"https://avatars-next.observableusercontent.com/1dd94096da79a76babfe37a3431edc30377043a898592a3437e913920b189ed3","tier":null}],"members":[{"type":"individual","id":"921009d8ff1c586f","login":"gjrichter","name":"","avatar_url":"https://avatars-next.observableusercontent.com/1dd94096da79a76babfe37a3431edc30377043a898592a3437e913920b189ed3","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"ixmaps - COVID-19 weekly new cases and fatalities - last 20 weeks","cells":[{"id":352,"value":"md`# ixmaps - COVID-19 weekly new cases and fatalities - last 20 weeks`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":453,"value":"","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":626,"value":"The above map shows new Covid-19 cases and fatalities accumulated by weeks for the last 20 weeks. It is realized with the iXMaps framework and an visualization project described below.\nIt features the iXMaps ability to create line plots on map position. \n\n> **Note**: every curve has its own scale to fit best into the plot. New cases are usually 100 times the fatalities. Here they are plotted with different scales into the same area to see the the ratio and dependency of both, before and after the vaccination campaign. \n \n\nThe data comes from the Johns Hopkins University CSSE and is published with daily updates on GitHub.\n\nIn the following we show the raw data, the data preparation process and the definition of the iXmaps project to create the above interactive map.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":419,"value":"---\n# Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":641,"value":"The data contains the new COVID-19 cases for all countries and days since febrary 2020. Here we load the data from it's GitHub repository","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":409,"value":"rawdata = d3.csv(\"https://raw.githubusercontent.com/CSSEGISandData/COVID-19/master/csse_covid_19_data/csse_covid_19_time_series/time_series_covid19_confirmed_global.csv\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":414,"value":"Inputs.Table(rawdata)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":744,"value":"rawdata_f = d3.csv(\"https://raw.githubusercontent.com/CSSEGISandData/COVID-19/master/csse_covid_19_data/csse_covid_19_time_series/time_series_covid19_deaths_global.csv\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":528,"value":"## processing","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":577,"value":"We want to show smoothed data (7 days roling mean) for the the last 56 days.\n\nSo we first first calculate the roling mean over 7 days. Than we take the last 56 columns names (dates) to parametrize the visualization theme (fields_56).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":650,"value":"> *first of all, the data is imported into a Data object (Data.import(...)) which defines some data manipulation methods*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":435,"value":"confirmed_7 = __every_7(__mean_7(Data.import({\"source\":rawdata,\"type\":\"json\"})))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":733,"value":"Inputs.Table(confirmed_7.json())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":445,"value":"last_56 = confirmed_7.columnNames();","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":584,"value":"Now we create the variables and arrays to parametrize the theme","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":449,"value":"fields_56 = last_56.slice(-21).join(\"|\");","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":472,"value":"label_56 = last_56.slice(-20);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":477,"value":"xaxis_56 = last_56.slice(-20);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":588,"value":"We transform the xaxis values in something readable.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":481,"value":"{\nfor ( var i=1; i < xaxis_56.length-1; i++ ){\n\t\t\txaxis_56[i] = (xaxis_56.length-i)%14?\" \":new Date(xaxis_56[i]).toLocaleDateString();\n\t\t}\n\t\txaxis_56[0] = new Date(xaxis_56[0]).toLocaleDateString();\n\t\txaxis_56[xaxis_56.length-1] = new Date(xaxis_56[xaxis_56.length-1]).toLocaleDateString();\n return xaxis_56;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":592,"value":"The last column name gives us the last updated text for the legend","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":495,"value":" actual_date = xaxis_56[xaxis_56.length-1];","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":761,"value":"---\nnow we do the same for the fatalities","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":747,"value":"fatalities_7 = __every_7(__mean_7(Data.import({\"source\":rawdata_f,\"type\":\"json\"})))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":750,"value":"last_56_f = fatalities_7.columnNames();","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":755,"value":"fields_56_f = last_56_f.slice(-21).join(\"|\");","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":757,"value":"label_56_f = last_56_f.slice(-20);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":759,"value":"xaxis_56_f = last_56_f.slice(-20);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":766,"value":"{\nfor ( var i=1; i < xaxis_56_f.length-1; i++ ){\n\t\t\txaxis_56_f[i] = (xaxis_56_f.length-i)%14?\" \":new Date(xaxis_56_f[i]).toLocaleDateString();\n\t\t}\n\t\txaxis_56_f[0] = new Date(xaxis_56_f[0]).toLocaleDateString();\n\t\txaxis_56_f[xaxis_56.length-1] = new Date(xaxis_56_f[xaxis_56_f.length-1]).toLocaleDateString();\n return xaxis_56_f;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":555,"value":"---\n# Visualization project","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":596,"value":"An iXMaps project consists of map specifications and one or more theme definitions. \n\nHere we define first the theme and than the project that includes the theme.\n\n> *! we use the variables defined above during the data processing*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":547,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":769,"value":"$35","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":661,"value":"
The project defines the map, the legend and the interactive behavior.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":575,"value":"$36","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":601,"value":"
To initialize the interactive visualization, we use the below function of the iXMaps API to wait for the platform loaded into an iframe (top of page) to be ready and use the returned map handle to load the data and the project","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":572,"value":"{\n ixmaps.waitForMap('map1',map => {\n map.setData(confirmed_7,{type:\"jsonDB\",name:\"CONFIRMED\"});\n map.setData(fatalities_7,{type:\"jsonDB\",name:\"FATALITIES\"});\n map.loadProject(project());\n }) \n return project();\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":610,"value":"That's it!","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":516,"value":"--- \n### helper functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":432,"value":"\t__mean_7 = function(table) {\n\t\t\n\t\t// make mean of 7 days\n\t\tvar records = table.records;\n\t\tfor ( var r=0; r=10; c--){\n\t\t\t\trecords[r][c] = ((Number(records[r][c])+\n\t\t\t\t\t\t\t\t Number(records[r][c-1])+\n\t\t\t\t\t\t\t\t Number(records[r][c-2])+\n\t\t\t\t\t\t\t\t Number(records[r][c-3])+\n\t\t\t\t\t\t\t\t Number(records[r][c-4])+\n\t\t\t\t\t\t\t\t Number(records[r][c-5])+\n\t\t\t\t\t\t\t\t Number(records[r][c-6]))/7).toFixed(2);\n\t\t\t}\n\t\t}\n\t\tvar columns = table.columnNames();\n\t\ttable.column(columns[4]).remove();\n\t\ttable.column(columns[5]).remove();\n\t\ttable.column(columns[6]).remove();\n\t\ttable.column(columns[7]).remove();\n\t\ttable.column(columns[8]).remove();\n\t\ttable.column(columns[9]).remove();\n\t\t\n\t\treturn table;\n }; \n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":691,"value":"\t__every_7 = function(table) {\n\t\t\n\t\t// remove columns to get a table with data every 28 day\n var columnsA = table.columnNames();\n\n // skip first 4 columns \n columnsA.shift();\n columnsA.shift();\n columnsA.shift();\n columnsA.shift();\n\n var len = columnsA.length;\n for (var i = 0; i < len; i++) {\n if ( i%7 ){\n table.column(columnsA[len-1-i]).remove();\n }\n }\n\t\n\t\treturn table;\n };","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":503,"value":"---\n### Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":507,"value":"ixmaps = require('https://gjrichter.github.io/ixmaps/ui/js/htmlgui_api.js')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"Inputs = require(\"@observablehq/inputs@0.7.21/dist/inputs.umd.min.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":513,"value":"Data = require('https://gjrichter.github.io/data.js/data.js')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W37","stdlib":"1","titling":"auto"}} 33:"$32:body"

COVID-19 new cases / fatalities last 20 weeks

data: 2019 Novel Coronavirus COVID-19 (2019-nCoV) Data Repository by Johns Hopkins CSSElast update: "+actual_date+"

COVID-19
new cases / fatalities
last 20 weeks

data: 2019 Novel Coronavirus COVID-19 (2019-nCoV) Data Repository by Johns Hopkins CSSE

last update: "+actual_date+"