The avatar for @zu-peng
Ziyu Peng
Public
Edited
Mar 3, 2023
Fork of First Observable Notebook 2023: Hello "show me another"
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
protagonistName = "Elinor Dashwood"
Insert cell
Insert cell
<p><i>${protagonistName} awoke to the rising sun.</i></p>
Insert cell
Insert cell
Insert cell
alexei = ({
first_name: "Alexei",
last_name: "Karamozov",
age: 20,
nickname: "Aloysha",
job: "novice at monastery"
})
Insert cell
<blockquote>
<p><i>${alexei.first_name}</i>, one of the many <b>${alexei.last_name}</b> brothers, was only ${alexei.age} and working as a ${alexei.job} when misfortune befell the young man known as "${alexei.nickname}" along with his whole family.</p>
</blockquote>
Insert cell
Insert cell
Insert cell
import { san_diego_stops } from "@eads/first-observable-notebook-imports"
Insert cell
Insert cell
data = aq.from(san_diego_stops)
Insert cell
Insert cell
Insert cell
sample5 = data.sample(5)
Insert cell
Inputs.table(sample5)
Insert cell
Insert cell
single_sample = data.sample(1).object(0)
Insert cell
Insert cell
Insert cell
<p>There was a traffic stop for <i>${single_sample.reason_for_stop}</i> in ${single_sample.address_city} on ${single_sample.date_stop} at ${single_sample.time_stop}.</p>
Insert cell
Insert cell
Insert cell
Insert cell
viewof showAnother = Inputs.button("Show me another")
Insert cell
The button has been clicked ${showAnother} times.
Insert cell
Insert cell
sample_stop = {
showAnother;
return data.sample(1).object(0);
}
Insert cell
Insert cell
<p><b>When:</b> ${sample_stop.date_stop} at ${sample_stop.time_stop}</p>

<p><b>Who initiated stop?</b> ${sample_stop.assignment} agent from ${sample_stop.agency} on beat ${sample_stop.beat_name} with ${sample_stop.exp_years} years experience.</p>

<p><b>Where did it happen?</b> ${sample_stop.address_block} ${sample_stop.address_street}, ${sample_stop.address_city}.</p>

<p><b>Who was stopped?</b> Perceived to be ${sample_stop.perceived_age} year old ${sample_stop.perceived_gender}. Perceived to speak ${sample_stop.perceived_limited_english ? "limited" : "fluent"} English. ${sample_stop.perceived_lgbt === "No" ? "Not perceived" : "Perceived"} to be LGBT.</p>

<p><b>How long was the stop?</b> They were stopped for ${sample_stop.stopduration} minutes.</p>

<p><b>Why were they stopped?</b> ${sample_stop.reason_for_stop} - ${sample_stop.reason_for_stop_code_text} ${sample_stop.reason_for_stop_detail} - ${sample_stop.reason_for_stop_explanation}</p>
Insert cell
Insert cell

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.
Learn more