data = FileAttachment("n631_4@2.csv").csv({typed:true})
size = width
height =
{ let n;
if (size>=850) {return n=800}
else if (size>=500 && size<850) {return n=500}
else if (size>=400 && size<500) {return n=350}
else if (size>=350 && size<400) {return n=280}
else {return n=250}
}
dX =
{
let n;
if (size>=350) {return n=20}
else {return n=10}
}
dY =
{
let n;
if (size>=350) {return n=-1}
else {return n=0}
}
radius =
{ let n;
if (size>=870) {return n=12}
else if (size>=510 && size<870) {return n=9}
else if (size>=370 && size<510) {return n=5}
else {return n=3.5}
}
tick =
{
let n;
if (size>=350) {return n=19}
else {return n=30}
}
r = 11
<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins');
p, h1, h2, h3 {
font-family: poppins, sans-serif;
color: #414141;
}
p {
font-family: poppins, sans-serif;
font-size: 14px
}
.plot-d6a7b5 {
max-width: 80%
}
text {
font-size: calc(11px + 0.590625vw)
}
[aria-label="text"] {
font-family: poppins, sans-serif;
/*color: #000;*/
font-size: 15px;
}
[aria-label="y-axis tick label"] {
font-family: poppins, sans-serif;
}
:where(.plot-d6a7b5-swatches) {
font-family: poppins, sans-serif;
font-size: 14px;
}
:where(.plot-d6a7b5 text), {
white-space: pre;
font-family: poppins,sans-serif;
}
:where(.plot-d6a7b5) {
--plot-background: white;
font-family: poppins, sans-serif;
}
rect:nth-of-type(n):hover {
fill: #ffb322;
stroke: #ffb322;
filter: drop-shadow(0 0 0.75rem #ffb322);
}
figure > h2 {
font-family: poppins, sans-serif;
font-size: 25px;
}
figure > h3 {
font-family: poppins, sans-serif;
font-size: 20px;
}
[aria-label="x-axis label"] {
font-size:0;
}
g[aria-label="tip"] {
font-size: 13px;
color: black;
fill: white;
/*stroke: #5bd39e;*/
opacity: .8;
}
[aria-label="tip"] {
border-radius: 30px;
border: 1px black solid;
}
</style>
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.
