The end-to-end solution for building and hosting better data apps, dashboards, and reports.
Plot.plot({
marks: [
Plot.axisX({tickFormat: ((f1, f2) => (x) => x.getUTCMonth() ? f1(x) : `${f1(x)}\n${f2(x)}`)(d3.utcFormat("%B"), d3.utcFormat("%Y"))}),
Plot.lineY(someaapl, {x: "Date", y: "Close"})
]
})
Plot.plot({
marks: [
Plot.axisX({ticks: d3.utcMonth.every(3), tickFormat: "%B"}),
Plot.axisX({ticks: d3.utcYear, tickFormat: "\n%Y", tickSize: 0}),
Plot.lineY(someaapl, {x: "Date", y: "Close"})
]
})
Plot.plot({
marks: [
Plot.gridX({ticks: d3.utcMonth.every(3)}),
Plot.axisX({ticks: d3.utcMonth.every(3), tickFormat: " %B", tickSize: 14, tickPadding: -10, textAnchor: "start"}),
Plot.axisX({ticks: d3.utcYear, tickFormat: "\n %Y", tickSize: 24, tickPadding: -20, textAnchor: "start"}),
Plot.lineY(someaapl, {x: "Date", y: "Close"})
]
})
Plot.plot({
marks: [
Plot.gridX({ticks: d3.utcMonth}),
Plot.axisX({ticks: d3.utcMonth, tickFormat: " %b", tickSize: 0, tickPadding: 3, x: (x) => (+x + +d3.utcMonth.offset(x)) / 2}),
Plot.axisX({ticks: d3.utcMonth, tickFormat: "", tickSize: 14}),
Plot.lineY(someaapl, {x: "Date", y: "Close"})
]
})
someaapl = aapl.slice(-300)
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.
