Public
Edited
Sep 26, 2023
This is amount ${amount} which I selected
viewof amount = Inputs.range([0,100], {label: "Amount", step: 1})
// テーブルの表示
viewof table = Inputs.table(olympians)
olympians
// data = fetch('https://jsonplaceholder.typicode.com/todos/1')
// .then(response => response.json())
d3.json('https://jsonplaceholder.typicode.com/todos')
Plot.plot({
marks: [
Plot.rectY(olympians, Plot.binX({y: "count"}, {x: "weight"})),
Plot.ruleY([0])
]
})
cars
viewof button = Inputs.button("Click me")
viewof toggle = Inputs.toggle({label: "Active", value: true})
viewof select = Inputs.select(["A", "B"], {label: "Select one"})
viewof date = Inputs.date({label: "Date", value: "2023-09-26"})
viewof range = Inputs.range([0, 100], {label: "Amount", step: 1})
viewof text = Inputs.text({label: "Name"})
viewof letter = Inputs.select(letters, {label: "Favorite letter", value: "0"})
viewof color = Inputs.color({label: "Bars color", value: "#4682b4"})
viewof highlight = Inputs.color({label: "Highlight color", value: "#ffa500"})
letterFrequency = Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency",
fill: d => d.letter === letter ? highlight : color,
sort: {x: "y", reverse: true} })
],
caption: "Frequency of letters in English text"
})
olympians
d3.group(olympians, d => d.sport)
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.
