The end-to-end solution for building and hosting better data apps, dashboards, and reports.
viewof sport = Inputs.select(sports, {label: "Sport"})
Inputs.range([0, 100], {label: "Amount", step: 5})
viewof amount = Inputs.range([0, 100], {label: "Amount", step: 1})
viewof button = Inputs.button("Click me")
viewof toggle = Inputs.toggle({label: "Toggle", value: true})
viewof checkboxes = Inputs.checkbox(["A", "B"], {label: "Check boxes", value: ["A"]})
viewof radios = Inputs.radio(["A", "B"], {label: "Radio buttons", value: "A"})
viewof date = Inputs.date({label: "Date", value: "2022-12-22"})
viewof text = Inputs.text({label: "Text"})
viewof letter = Inputs.select(letters, {label: "Favorite letter", value: "O"})
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}}),
Plot.ruleY([0])
],
caption: "Frequency of letters in English texts",
ariaLabel: "Frequency of letters in English texts",
ariaDescription: `This bar chart shows the frequency of letters in English texts. We see that the top five most common letters are E, T, A, O and I.`
})
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.
