Public
Edited
Nov 9, 2022
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
x = 5000
Insert cell
y = x * x * 100
Insert cell
`x` の値は `${x}` です。

`y` の値は `${y}` です。
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// 一つ目のセル
myName = "..."
Insert cell
// 二つ目のセル
function () {}
Insert cell
// 三つ目のセル
Insert cell
Insert cell
Insert cell
viewof celcius = Inputs.range([0, 40], { value: 25, step: 0.1, label: "気温" })
Insert cell
ol = require("ol@7.1")
Insert cell
- 現在の気温は「${celcius}°C」です!
- これは華氏でいうと「${celcius * 1.8 + 32}℉」です
Insert cell
Insert cell
viewof color = Inputs.color({ label: "色", value: "#005773" })
Insert cell
viewof date = Inputs.date({ label: "日付" })
Insert cell
viewof file = Inputs.file({
label: "CSVファイル",
accept: ".csv",
required: true
})
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
import {municipalities} from "@sorami/japanese-from-hokkaido-to-okinawa"
Insert cell
municipalities
Insert cell
Insert cell
Insert cell
viewof minPopulation = Inputs.range([0, 2_000_000], {
value: 0,
step: 100000,
label: "人口の下限"
})
Insert cell
filteredMunics = municipalities.filter((d) => d.population >= minPopulation)
Insert cell
Insert cell
Inputs.table(filteredMunics)
Insert cell
Insert cell
Plot.rectY(
filteredMunics,
Plot.binX({ y: "count" }, { x: "population", fill: "prefecture" })
).plot()
Insert cell
Plot.rect(
filteredMunics,
Plot.bin(
{ fillOpacity: "count" },
{ x: "longitude", y: "latitude", fill: "prefecture" }
)
).plot()
Insert cell

One platform to build and deploy the best data apps

Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.
Learn more