internet visuals @washingtonpost
Public
Edited
Mar 2, 2023
x = 3
y = 4
X is equal to ${x}
moment = require("moment")
jan1st = moment("2023-01-02")
first = "aadit"
last = "tambe"
${first} ${last}
function add(a,b){
return a+ b
}
add(2,3)
import {san_diego_stops} from '@eads/first-observable-notebook-imports'
data =aq.from(san_diego_stops)
sample5 = data.sample(5)
viewof showAnother = Inputs.button('show me another')
sample_stop = {
showAnother
return data.sample(1).object(0)
}
// import {cases_judges} from "@eads/first-observable-notebook-data-work"
variables = ["B01003_001E"]
url = `https://api.census.gov/data/2021/acs/acs5?get=NAME,${Array.from(variables.values())}&for=place:04416&in=state:39`
function graphql(payload, headers = {}) {
headers["content-type"] = "application/json";
return fetch("https://ohiocourts.hasura.app/v1/graphql", {
body: JSON.stringify(payload),
headers: headers,
method: "POST",
mode: "cors"
})
.then((response) => {
return response.json();
})
.then((jsonData) => {
return jsonData.data;
});
}
cases_judges = graphql({
operationName: "MyQuery",
query: `
query MyQuery {
cases {
case_year
judge
arresting_agency
}
}
`
})
cases_judges_dt = aq.from(cases_judges.cases)
import { aq, op } from "@uwdata/arquero"
cases_judges_dt
.groupby("arresting_agency")
.count()
.orderby(aq.desc("count"))
.view()
cases_judges_dt
.groupby("arresting_agency", "case_year")
// Here is the full form of count!
.rollup({county:op.count()})
.orderby(aq.desc("county"))
.view()
cases_judges_dt
.groupby("arresting_agency", "case_year")
.count()
.filter(d=>d.case_year==2021)
.join(
cases_judges_dt
.groupby("arresting_agency", "case_year")
.count()
.filter(d=>d.case_year==2016),
"arresting_agency")
.derive({pct_increase: d=>(d.count_1-d.count_2)*100/d.count_2})
.orderby(aq.desc("pct_increase"))
//.filter(d=>d.count_1+d.count_2>100)
.view()
penguins
Plot.plot({
color: {
legend: true
},
caption: "penguin length",
style:{
background: "pink",
},
marks: [
Plot.dot(penguins, {
x:"flipper_length_mm",
y: "body_mass_g",
fill: "sex",
})
]
})
Plot.plot({
color: {
legend: true
},
caption: "penguin length",
style:{
// background: "pink",
},
marks: [
Plot.dot(penguins, {
x:"flipper_length_mm",
y: "body_mass_g",
fill: "sex",
opacity: 4
})
]
})
Plot.auto(penguins, {x:"culmen_depth_mm", y: "culmen_length_mm"}).plot()
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
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.
