sex = (userSelections)=> userSelections.sex
calculateYearlyMean = (dataset, selectedDataSet) => {
return dataset.map((series)=>{
const data = series.data
const yearlyValues = data.reduce((acc, dataObj)=>{
acc[`${dataObj.date.getFullYear()}`].push(dataObj.value)
return acc
},{'2018': [], '2019': [], '2020': [], '2021': []})
const yearlyMeans = Object.keys(yearlyValues).reduce((acc, yrKey)=>{
const valArray = yearlyValues[yrKey]
let mean = d3.mean(valArray)
if(mean) {
const type = selectedDataSet.yLabel.replace("~d", '')
if (type === 'k') {
mean = Math.round(+mean)
} else {
mean = +mean.toFixed(2)
}
acc[`${yrKey}_mean`] = `${selectedDataSet.yLabel.replace("~d", mean )}`
}
return acc
},{})
let prev
let prevKey
const monthlyDiffObject = Object.keys(yearlyValues).reduce((acc, yrKey)=>{
const valArray = yearlyValues[yrKey]
if(prev) {
const monthlyDiffs = valArray.map((val, i)=> +(val - prev[i]).toFixed(3))
acc[`${prevKey}-${yrKey}`] = monthlyDiffs
}
prev = valArray
prevKey = yrKey
return acc
},{})
return Object.assign({}, {"ethnicity": series.ethnicity, "race": series.race, age: series.age, "sex": series.sex, ...yearlyMeans})
})
}
calculateMonthDiffs = (dataset, selectedDataSet) => {
let timeseries = []
dataset.forEach((series)=>{
const data = series.data
const yearlyValues = data.reduce((acc, dataObj, index)=>{
const month = monthArray[dataObj.date.getMonth()]
acc[`${dataObj.date.getFullYear()}`].push({value: dataObj.value, month})
return acc
},{'2018': [], '2019': [], '2020': [], '2021': []})
let prev
let prevKey
const monthlyDiffObject = Object.keys(yearlyValues).reduce((row, yrKey)=>{
const valArray = yearlyValues[yrKey]
const monthObj = monthArray.reduce((obj, key)=>{
obj[key] = undefined
return obj
},{})
if(prev && prev.length > 0) {
const monthlyDiffs = valArray.reduce((acc, valObj, i)=>{
const val = valObj.value
const prevValue = prev.find((d)=> valObj.month === d.month)
if(prevValue) {
const diff = +(val - prevValue.value).toFixed(3)
acc[valObj.month] = `${selectedDataSet.yLabel.replace("~d", diff )}`
}
return acc
},monthObj)
row.push( Object.assign({}, {"ethnicity": series.ethnicity, "race": series.race, age: series.age, "sex": series.sex, year_range:`${prevKey}-${yrKey}`, ...monthlyDiffs}) )
}
prev = valArray
prevKey = yrKey
return row
}, [])
timeseries = [...timeseries, ...monthlyDiffObject]
})
if(timeseries.length > 0) {
return timeseries
}
return [{error: "no previous monthly data"}]
}
getSelectedDates = (dataFiltered) => {
const setDates = dataFiltered.reduce((acc, d)=>{
d.data.forEach((dateObj)=> acc.add(dateObj.date.toDateString()))
return acc
},new Set([]))
const dateArray = Array.from(setDates)
const result = dateArray.map((d)=> new Date(d))
return result
}
x = (dates) => d3.scaleUtc()
.domain(d3.extent(dates))
.range([margin.left, width - margin.right])
y = (yExtent) => d3.scaleLinear()
.domain([0, yExtent[1]]).nice()
.range([height - margin.bottom, margin.top])
yExtent = (dataFiltered) => {
const allYValues = dataFiltered.reduce((acc, d)=>{
const values = d.data.map((dataItems)=> dataItems.value)
acc= [...acc, ...values]
return acc
},[])
return d3.extent(allYValues)
}
axis = (dataFiltered, timeRangeSelection) =>{
const extent = yExtent(dataFiltered)
const yScale = y(extent)
const xScale = xlineScale(timeRangeSelection)
return {xScale, yScale}
}
setSelectedDataSet = (selectedDatasetOption) => {
const found = datasets.find((d)=> d.name === selectedDatasetOption)
if(found) {
return found
}
}
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.
