An curious maker & coder from Malaysia, doing fun projects related to Arduino RPi, IoT, PCB, LED, linux, javascript (p5, phaser, Vue), dataviz & art installation
md `# Stack Covid-19 MY Charts by States`
viewof casebyState3 = rangeSlider(casebyState2, d=>d.date)
New cases of all states stacked
url = "https://raw.githubusercontent.com/MoH-Malaysia/covid19-public/main/epidemic/cases_state.csv"
casebyState = await d3.csv(url)
dateParser = d3.timeParse("%Y-%m-%d")
//startDate = dateParser(casebyState[0].date)
//endDate = dateParser(casebyState[7919].date)
stateList = _.uniqBy(casebyState, d => d.state)
.map(d => d.state)
stateList2 = []
stateList2[0] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[0] )
stateList2[1] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[1] )
stateList2[2] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[2] )
stateList2[3] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[3] )
stateList2[4] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[4] )
stateList2[5]= casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[5] )
stateList2[6] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[6] )
stateList2[7] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[7] )
stateList2[8] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[8] )
stateList2[9] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[9] )
stateList2[10] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[10] )
stateList2[11] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[11] )
stateList2[12] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[12] )
stateList2[13] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[13] )
stateList2[14] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[14] )
stateList2[15] = casebyState.map( d => (
{
date: dateParser(d.date),
state: d.state,
newCases: d.cases_new
}
)
)
.filter(d => d.state == stateList[15] )
import {rangeSlider} from "@bumbeishvili/utils"
import {swatches as Swatches} from "@d3/color-legend"
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.
