Plot.plot({
width: 1280,
marks: [
Plot.areaY(
new_appl_data.filter((d) => d.value >= 0),
{
x: (d) => d.Date,
y: (d) => d.value,
fill: "green"
}
),
Plot.areaY(
new_appl_data.filter((d) => d.value <= 0),
{
x: (d) => d.Date,
y: (d) => d.value,
fill: "red"
}
),
Plot.line(new_appl_data, { x: (d) => d.Date, y: (d) => d.value })
]
})
new_appl_data = {
let new_data = [shifted_appl_data[0]];
for (let i = 1; i < shifted_appl_data.length; i++) {
let d1 = new_data.slice(-1)[0];
let v1 = d1.value;
let d2 = shifted_appl_data[i];
let v2 = d2.value;
if (v1 * v2 < 0) {
let t1 = d1.Date.getTime();
let t2 = d2.Date.getTime();
let t = new Date((t2 * v1 - t1 * v2) / (v1 - v2));
new_data.push({ Date: t, value: 0 });
}
new_data.push(shifted_appl_data[i]);
}
return new_data;
}
shifted_appl_data = aapl.map((d) => Object.assign(d, { value: d.High - 110 }))
Plot.plot({
width: 1280,
marks: [
Plot.areaY(
quarter_data2 .filter((d) => d.value >= 0),
{
x: (d) => d.quarter,
y: (d) => d.value,
fill: "green",
}
),
Plot.areaY(
quarter_data2 .filter((d) => d.value <= 0),
{
x: (d) => d.quarter,
y: (d) => d.value,
fill: "red",
}
),
Plot.line(quarter_data2, { x: (d) => d.quarter, y: (d) => d.value,
interval: "quarter",
marker: false,
tip: true
}),
Plot.line(quarter_data, { x: (d) => d.quarter, y: (d) => d.value,
interval: "quarter",
marker: true,
})
]
})
quarter_data = FileAttachment("test_file.csv").csv().then(data => {
data.forEach(d => {
const year = d.quarter.slice(0, 4);
const quarter = d.quarter.slice(5, 6);
let month;
switch (quarter) {
case '1':
month = '01';
break;
case '2':
month = '04';
break;
case '3':
month = '07';
break;
case '4':
month = '10';
break;
}
d.quarter = new Date(`${year}-${month}-01`);
d["value"] = d["value"] === '..' ? null : +d["value"];
});
return data;
})
// this also doesnt work
quarter_data2 = {
let new_data = [quarter_data[0]];
for (let i = 1; i < quarter_data.length; i++) {
let d1 = new_data.slice(-1)[0];
let v1 = d1.value;
let d2 = quarter_data[i];
let v2 = d2.value;
if (v1 * v2 < 0) {
let t1 = d1.quarter.getTime();
let t2 = d2.quarter.getTime();
let t = new Date((t2 * v1 - t1 * v2) / (v1 - v2));
new_data.push({ quarter: t, value: 0 });
}
new_data.push(quarter_data[i]);
}
return new_data;
}
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.
