Published
Edited
Feb 3, 2022
myData = FileAttachment("MTL-2018.json").json()
myConvertedData = {
const parseTime = d3.timeParse("%s");
const time = (sec) => parseTime(sec);
return myData.map(d => {
const obj = {};
obj.date = time(d.time);
obj.kwh = d.temperatureLow;
obj.low = d.temperatureLow;
return obj;
});
}
import {
finalviz as timeSeries}
with {myConvertedData as data}
from "@enjalot/power-usage-workbook"
finalviz = addTooltips(
Plot.dot(myConvertedData, {
x: "date",
y: "low",
title: tip,
fill: (d, i) => (d.low > movingAvg[i] ? 1 : 0)
}).plot({
y: { grid: false },
x: {
tickRotate: 90,
tickFormat: (d) => timeFormat(d)
},
marks: [
Plot.ruleY([0]),
Plot.ruleX(myConvertedData, { x: "date", y: "low", stroke: "#eee", strokeWidth: 3, title: tip }),
Plot.line(
myConvertedData,
Plot.windowY({
x: "date",
y: (d) => d.low,
k: 7,
stroke: "lightgray",
shift: "trailing"
})
)
],
marginLeft: 30,
marginBottom: 100,
marginRight: 50,
width: width,
color: {
range: ["steelblue", "orange"]
}
})
)
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.
