🎬🚖 Checkpoint

./public/index.js:1954897/107767

db.csv

@@ -357,3 +357,34 @@ ECSW,1636905789193,5
 ECSW,1636905817091,5
 ECSW,1636905830742,4
 ECSW,1636905844049,5
+ECSW,1636905859959,5
+ECSW,1636905873204,5
+ECSW,1636905886221,4
+ECSW,1636906033495,6
+ECSW,1636906049683,5
+ECSW,1636906088556,6
+ECSW,1636906101994,6
+ECSW,1636906115453,6
+ECSW,1636906133440,6
+ECSW,1636906147030,6
+ECSW,1636906162246,6
+ECSW,1636906176910,6
+ECSW,1636906192909,6
+ECSW,1636906207273,6
+ECSW,1636906229453,6
+ECSW,1636906243460,5
+ECSW,1636906261867,5
+ECSW,1636906275730,5
+ECSW,1636906288988,4
+ECSW,1636906309260,6
+ECSW,1636906343059,6
+ECSW,1636906357765,5
+ECSW,1636906373652,5
+ECSW,1636906390674,6
+ECSW,1636906414975,6
+ECSW,1636906434962,6
+ECSW,1636906448510,5
+ECSW,1636906463056,5
+ECSW,1636906476863,6
+ECSW,1636906490469,4
+ECSW,1636906504649,6

public/index.js

@@ -83,22 +83,23 @@ async function drawRegions() {
     
     const min = Math.min(...data.map(d => d.count))
     const max = Math.max(...data.map(d => d.count))
-    // const busy = delta > 0
-    // const color = busy ? '#ff0000' : '#00ff00'
 
     const red = new Color(255, 0, 0)
     const green = new Color(0, 255, 0)
+    console.log({current, max, min})
     const color = red.interpolate(green, current / (max - min))
 
+    console.log(color)
+
     buildings.ECSW.poly.setStyle({ color })
     console.log({avg, current, delta, color})
 }
 
 class Color {
     constructor(r, g, b) {
-        this.r = r
-        this.g = g
-        this.b = b
+        this.r = Math.ceil(0, Math.floor(255, r))
+        this.g = Math.ceil(0, Math.floor(255, g))
+        this.b = Math.ceil(0, Math.floor(255, b))
     }
     asRgbCss() {
         return "rgb("+this.r+", "+this.g+", "+this.b+")"
@@ -122,6 +123,10 @@ function getData() {
     })
 }
 
+function lerp(v0, v1, x) {
+    return (1 - x) * v0 + x * v1
+}
+
 
 async function displayCard(id) {
     const data = (await getData()).filter(d => d.loc === id && Date.now() - d.time < 60 * 60 * 1000)
@@ -139,13 +144,13 @@ async function displayCard(id) {
     const current = data[data.length - 1]?.count ?? NaN
     const avg = data.reduce((acc, v) => acc + v.count, 0) / data.length
     const delta = current - avg
-    const min = Math.min(...data.map(d => d.count))
-    const max = Math.max(...data.map(d => d.count))
+    // const min = Math.min(...data.map(d => d.count))
+    // const max = Math.max(...data.map(d => d.count))
     const busy = delta < 0
 
-    const red = new Color(255, 0, 0)
-    const green = new Color(0, 255, 0)
-    const color = red.interpolate(green, current / (max - min))
+    // const red = new Color(255, 0, 0)
+    // const green = new Color(0, 255, 0)
+    // const color = red.interpolate(green, current / (max - min))
 
     const msg = Number.isNaN(delta)
         ? "No data..."
@@ -180,9 +185,11 @@ function updateChart(data) {
             acc[v.ago] = []
         }
         acc[v.ago].push(v.count)
-        console.log(acc)
         return acc
-    }, Array.from({length: 6})).map(v => v.reduce((acc, v) => acc + v, 0) / v.length)
+    }, Array.from({ length: 6 })).map(v => {
+        if (typeof v === 'undefined') return NaN
+        return v.reduce((acc, v) => acc + v, 0) / v.length
+    })
 
     const ctx = document.getElementById('myChart').getContext('2d')
     const labels = ['Now', '10m ago', '20m ago', '30m ago', '40m ago', '50m ago'].reverse()