Published
Edited
Nov 3, 2021
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")
Inputs.Table(rawdata)
confirmed_7 = __every_7(__mean_7(Data.import({"source":rawdata,"type":"json"})))
Inputs.Table(confirmed_7.json())
last = confirmed_7.columnNames();
fields = last.slice(-55).join("|");
label = last.slice(-54);
xaxis = last.slice(-54);
{
for ( var i=1; i < xaxis.length-1; i++ ){
xaxis[i] = (xaxis.length-i)%14?" ":new Date(xaxis[i]).toLocaleDateString();
}
xaxis[0] = new Date(xaxis[0]).toLocaleDateString();
xaxis[xaxis.length-1] = new Date(xaxis[xaxis.length-1]).toLocaleDateString();
return xaxis;
}
actual_date = new Date(xaxis[xaxis.length-1]).toLocaleDateString();
fatalities_7 = __every_7(__mean_7(Data.import({"source":rawdata_f,"type":"json"})))
last_f = fatalities_7.columnNames();
fields_f = last_f.slice(-55).join("|");
label_f = last_f.slice(-54);
xaxis_f = last_f.slice(-54);
theme = () => {
return {
"layer": "World Mercator",
"field": fields,
"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,150,150,1)"],
"fillopacity": "0.3",
"shadow": "false",
"dbtable": "CONFIRMED",
"datacache": "false",
"lookupfield": "Lat|Long",
"symbols": [
"circle"],
"units": "",
"label": label,
"xaxis": xaxis,
"normalsizevalue": "2",
"scale": "0.1",
"rangescale": "0.5",
"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 <br> last 56 days",
"snippet": "fonte: <a href='https://github.com/CSSEGISandData/COVID-19' target='_blank'>JHU CCSE</a>"
}
}
}
theme_f = () => {
return {
"layer": "World Mercator",
"field": fields_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_f,
"xaxis": xaxis_f,
"normalsizevalue": "2",
"scale": "0.1",
"rangescale": "0.5",
"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 <br> last 56 days",
"snippet": "fonte: <a href='https://github.com/CSSEGISandData/COVID-19' target='_blank'>JHU CCSE</a>"
}
}
}
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": "<h1>COVID-19 <br> <b style='color:rgba(200, 0, 90,1)'>new cases</b> / <b>fatalities</b> <br> last <b>54</b> weeks</h1><h4>data: 2019 Novel Coronavirus COVID-19 (2019-nCoV) Data Repository by <a href='https://github.com/CSSEGISandData/COVID-19' target='_blank'>Johns Hopkins CSSE</a><br><br>last updated: "+actual_date+"</h4>",
"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()
],
}
}
{
ixmaps.waitForMap('map1',map => {
map.setData(confirmed_7,{type:"jsonDB",name:"CONFIRMED"});
map.setData(fatalities_7,{type:"jsonDB",name:"FATALITIES"});
map.loadProject(project());
})
return project();
}
ixmaps = require('https://gjrichter.github.io/ixmaps/ui/js/htmlgui_api.js')
Inputs = require("@observablehq/inputs@0.7.21/dist/inputs.umd.min.js")
Data = require('https://gjrichter.github.io/data.js/data.js')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
