import {data_standardized} from "94b66f8b4f3afc17"
viewof table = Inputs.table(data_standardized)
import {interval} from '@mootari/range-slider@1786'
Slider_TR
earliestYear_slider=Slider_TR[0]
latestYear_slider=Slider_TR[1]
earliestYear_slider_asTime = new Date(earliestYear_slider, 1).getTime()
latestYear_slider_asTime = new Date(latestYear_slider, 1).getTime()
import {Wrangler, op} from "@observablehq/data-wrangler"
data_standardized_filter = aq.from(data_standardized)
.filter(aq.escape(d => d["Date"] > earliestYear_slider_asTime))
.filter(aq.escape(d => d["Date"] < latestYear_slider_asTime))
.objects()
Plot.plot({
x: {grid:true , nice: true}, y: {grid:true, nice : true , label: "Z-score"},
marks: [
Plot.lineY(data_standardized_filter, {
x: "Date",
y: "CloseStandardized",
stroke: "red"}),
Plot.lineY(data_standardized_filter, {
x: "Date",
y: d => d["VolumeStandardized"],
curve: "step",
stroke: "dodgerblue"})
]
})
import {Plot} from "@mkfreeman/plot-tooltip"
Plot.plot({
x: {grid:true, nice:true},
y: {grid:true, nice:true , label: "Z-score"},
marks: [
Plot.lineY(data_standardized_filter, {
x: "Date",
y: "CloseStandardized",
stroke: "red",
title: "X"}),
Plot.lineY(data_standardized_filter, {
x: "Date",
y: d => d["VolumeStandardized"],
curve: "step",
stroke: "dodgerblue",
title: d => d3.format (" .4s")(d["Volume"]), }),
Plot.dot(data_standardized_filter, {
x: "Date",
y: "CloseStandardized",
fill: "red",
title: d => d3.format (" .6s")(d["Close"]) ,
r: 2
}),
Plot.dot(data_standardized_filter, {
x: "Date",
y: d => d["VolumeStandardized"],
fill: "dodgherblue",
title: d => d3.format (" .4s")(d["Volume"]),
r: 2
})
]
})
Plot.plot({
x: {grid:true , nice:true},
y: {grid:true, nice:true , label: "Z-score"},
marks: [
Plot.lineY(data_standardized_filter, {
x: "Date",
y: "CloseStandardized",
stroke: "salmon",}),
Plot.lineY(data_standardized_filter, {
x: "Date",
y: d => d["VolumeStandardized"],
curve: "step",
stroke: "dodgerblue", }),
Plot.dot(data_standardized_filter, {
x: "Date",
y: "CloseStandardized",
fill: "salmon",
title: d => d3.format(" .3s")(d["Close"]) + " USD" ,
r: 1.5,
}),
Plot.dot(data_standardized_filter, {
x: "Date",
y: d => d["VolumeStandardized"],
fill: "dodgerblue",
title: d => (d3.format(" .3s")(d["Volume"] / 1_000_000_000)) + " Billions USD",
r: 1.5,
})
]
})
import {imageToDo} from "@clokman/student-blocks"
imageToDo
import {howTo} from "@clokman/howto"
import {showMe} from "@observablehq/show-me"
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.
