The avatar for @masterkeef93
masterkeef93
Public
Edited
Aug 17, 2024
Fork of T4 Bivariate Interactive
2
Insert cell
Insert cell
html`<div style="display: flex; justify-content: space-around; align-items: start;">
<div style="flex-basis: 60%;">${chart_select}</div>
<div style="flex-basis: 40%;">
<div>${viewof mapSelectInput}</div>
<div style="margin-top: 1em;">${submitSelect}</div>
<div style="margin-top: 1em;">${message_mapClick}</div>
</div>
<div style="height: 1000px;"></div>
</div>`
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
mapSelectValue
Insert cell
Insert cell
mutable mapSelectValue = null;
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
var1_label = "Vaccination (%)";
Insert cell
var2_label = "Mortality";
Insert cell
var1_definition = "Percentage of the population <br> fully vaccinated against COVID-19.";
Insert cell
var2_definition = "The number of people who <br> had COVID-19 and died from it.";
Insert cell
height = 500
Insert cell
Insert cell
var2_thresholds = [1, 2]
Insert cell
Insert cell
Insert cell
date_filter = "2021-03"
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
index = new Map(data.map(d => [d.county, d]));
Insert cell
dataFiltered = data.filter(d => d.state === selectedState)
Insert cell
Insert cell
us = FileAttachment("counties-albers-10m.json").json()
Insert cell
states = new Map(us.objects.states.geometries.map(d => [d.id, d.properties]))
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