Published
Edited
Nov 3, 2021
<iframe id="map1" width="100%" height="760" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://gjrichter.github.io/ixmaps/ui/dispatch.htm?name=map1&ui=embed&basemap=ll&align=right&legend=1&scrollsafe=1&sync=false"></iframe>
rawdata = 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")
Inputs.Table(rawdata)
confirmed_7 = __every_7(__mean_7(Data.import({"source":rawdata,"type":"json"})))
Inputs.Table(confirmed_7.json())
columns = confirmed_7.columnNames();
final = confirmed_7.subtable({"fields":columns.slice(0,4).concat(columns.slice(-91))});
Inputs.Table(final.json())
fields = columns.slice(-91).join("|");
label = columns.slice(-90);
xaxis =columns.slice(-90);
{
for ( var i=1; i < xaxis.length-1; i++ ){
xaxis[i] = (xaxis.length-i)%53?" ":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();
theme = () => {
return {
"layer": "World Mercator",
"field": fields,
"field100": "",
"style": {
"type": "CHART|SYMBOL|SEQUENCE|PLOT|LINES|AREA|LOLLIPOP|BOX|GRID|TITLE|COLOR|DIFFERENCE|SUM|FIXSIZE|NOLEGEND",
"colorscheme": [
"155",
"rgba(150,150,150,1)",
"rgba(50, 50, 50,1)"],
"fillopacity": "0.3",
"shadow": "false",
"dbtable": "CONFIRMED",
"datacache": "false",
"lookupfield": "Lat|Long",
"symbols": [
"circle"],
"units": "",
"label": label,
"xaxis": xaxis,
"normalsizevalue": "2",
"scale": "0.05",
"rangescale": "0.5",
"minvalue": "0",
"maxvalue": "auto",
"align": "23right",
"linewidth": "30",
"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)'>fatalities</b> by week</h1><h4>Moving average over 7 days. Every curve has its own scale to fit into the plot space </h4><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>last updated: "+actual_date+"</h4>",
"item": "html",
"scaleParam": {
"objectScaling": "1.7",
"normalSizeScale": "55000000",
"dynamicScalePow": "2"
},
"options": {
"featurescaling": "dynamic",
"objectscaling": "dynamic",
"flushChartDraw": "50000",
"mapopacity": "1",
"basemapopacity": "1"
},
"center": {
"lat": "38.134556577054134",
"lng": "12.304687500000002"
},
"zoom": "2"
},
"themes": [
theme()
],
}
}
{
ixmaps.waitForMap('map1',map => {
map.setData(final,{type:"jsonDB",name:"CONFIRMED"});
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.
