Published
Edited
Mar 26, 2020
1 fork
1 star
{
var c = prepData[prepData.length-1];
var r = [];
for(var i=0; i<prepData.length-1; i++) r.push(prepData[i+1].confirmed / prepData[i].confirmed);
var last3 = d3.mean(r.slice(r.length-3));
/*return {
deathRate : Math.round(c.deaths / c.confirmed * 10000) /100,
r: last3,
double: Math.round(Math.log(2) / Math.log(last3))
};*/
return html`<h2>Current Statistics</h2>
<ul>
<li><b>Cases: </b>${c.confirmed}</li>
<li><b>Deaths: </b>${c.deaths}</li>
<li><b>Recovered: </b>${c.recovered}</li>
<li><b>Death Rate: </b>${Math.round(c.deaths / c.confirmed * 10000) /100}%</li>
<li><b>Doubling of cases: </b> every ${Math.round(Math.log(2) / Math.log(last3))} days</li>
</ul>`;
}
tabulator(data.filter(d=>d.confirmed>0), {
paginationSize: 20,
columns: [
{title:"Country/Region", field: "country"},
{title:"State/Province", field: "state"},
{title:"Confirmed", field: "confirmed"},
{title:"Deaths", field: "deaths"},
{title:"Recovered", field: "recovered"},
{title:"Active", field: "active"},
{title:"Death Rate(%)", field: "dr", formatter:function(cell) {return ""+(Math.round(cell.getValue()*10000) / 100)+"%";}},
{title:"Daily Growth", field: "avgr", formatter: function(cell) {return (Math.round((cell.getValue()-1)*10000) /100)+"%"}},
{title:"Doubling", field: "avgr", formatter: function(cell){return Math.round(Math.log(2) / Math.log(cell.getValue()))}}
]
})
$ = require("jquery")
tabulator = {
await require("jqueryui");
await require("jquery.tabulator");
const cssUrl = "https://cdnjs.cloudflare.com/ajax/libs/tabulator/3.5.3/css/tabulator.min.css"
const link=html`<link rel="stylesheet" href="${cssUrl}">`;
if (window._tabLink) window._tabLink.remove();
document.body.append(window._tabLink = link);
return function(data, spec) {
const div = html`<div>`;
if(!spec) spec = {};
spec.data = data;
if(!spec.columns && data[0]) {
//Generate columns
const sample = data[0];
spec.columns = [];
Object.keys(sample).forEach(c=> {
spec.columns.push({title:c, field:c});
console.log(c);
});
}
if(!spec.pagination) spec.pagination = "local";
if(!spec.paginationSize) spec.paginationSize = 10;
$(div).tabulator(spec);
console.log(div);
return div;
};
}
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.
