{ const viewWidth=696 // const viewWidth=width const maxWidth=viewWidth const viewHeight=396 // const viewHeight=520 const margin = {top: 48, bottom: 60, left: 12, right: 12} const caffeineStreams=dosesToCaffeineStreams(state.doses, {totalHours, caffeinePerCupMg}) .sort((l,r)=>(l[0][0]-r[0][0])) const stackedStreams = stackStreams(caffeineStreams) let streamsToPlot= stackedStreams .map((curStream)=>{ return curStream .filter(([x])=>x<=30) .map(([x,y0,y])=>({x,y0,y}))}) // Assign IDs to the streams let streamCountByTime= new Map() streamsToPlot.forEach((curStream)=>{ const countForTime = (streamCountByTime.get(curStream[0].x) || 0) // Update streamCountByTime streamCountByTime.set(curStream[0].x, countForTime+1) // Set an ID on the current stream curStream.id = `${curStream[0].x}_${countForTime}` }) const streamIDs = new Set(streamsToPlot.map((ds)=>ds.id)) const enteredStreamIDs = new Set([...streamIDs].filter(x => !visibleStreamIDs.has(x))) const exitedStreamIDs = new Set([...visibleStreamIDs].filter(x => !streamIDs.has(x))) if ( 0 !== enteredStreamIDs.size || 0 !== exitedStreamIDs.size ) { // mutable visibleDataHashes = dataHashes console.log("Entered: " + Array.from(enteredStreamIDs)) console.log("Exited: " + Array.from(exitedStreamIDs)) new Promise(async ()=>{ await Promises.delay(500) mutable visibleStreamIDs = new Set([...visibleStreamIDs, ...enteredStreamIDs] .filter(x => !exitedStreamIDs.has(x))) }) } // Mark new streams as entered // This is not great and super fragile streamsToPlot.forEach(curStream=>{ curStream.entered = enteredStreamIDs.has(curStream.id) curStream.exited = exitedStreamIDs.has(curStream.id) }) // return streamsToPlot const maxCaffeine = d3.max(streamsToPlot.flat() .map(d=>caffeineSleepThreshold<=d.y)) const caffeineBelowSleepThreshold = (maxCaffeine <= caffeineSleepThreshold) const sleepTime = calculateSleepTime(streamsToPlot) const description = getDescriptionText(streamsToPlot) const descriptionParts = description.split("\n") const colors = d3.quantize(d3.interpolateRgb("#E6762A", "#F3E500"), Math.max(2,streamsToPlot.length)) // const grid = renderGrid() const grid = null const renderedCaffeineChart = caffeineChart(streamsToPlot, { colors, width: viewWidth-margin.left-margin.right, height: viewHeight-margin.top-margin.bottom, domain: [6,30] }) return svg` ` }