plot = {
let dataPlot = Plot.plot({
grid: true,
x: {
ticks: 10,
tickFormat: (d) => new Date(d * 1000).toLocaleString("de-DE"),
tickRotate: 0,
label: "Date and time →"
},
y: {
ticks: 8,
label: "↑ Temperature (°C)",
domain: [14, 32]
},
marks: [
Plot.ruleY([0]),
Plot.lineY(curveData, {
x: "date",
y: "temperature",
curve: "catmull-rom",
marker: "circle",
stroke: "red"
})
],
marginTop: 20,
marginBottom: 50
});
d3.select(dataPlot)
.select('[aria-label="x-axis"]')
.selectAll(".tick")
.select("text")
.call(function (t) {
t.each(function (d) {
var self = d3.select(this);
var s = new Date(d * 1000).toLocaleString("de-DE").split(",");
self.text(null);
self.append("tspan").attr("x", 0).attr("dy", ".8em").text(s[0]);
self.append("tspan").attr("x", 0).attr("dy", "1.2em").text(s[1]);
});
});
return dataPlot;
}