Published
Edited
Nov 5, 2021
1 star
Insert cell
Insert cell
Insert cell
Insert cell
filterLabel = html`<label>Puedes filtrar por origen o destino:</label>`
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
maxWidth = 660
Insert cell
myWidth = Math.min(width, maxWidth)
Insert cell
mediaQueryLimit = 500
Insert cell
isMobile = myWidth < mediaQueryLimit
Insert cell
textLimit = isMobile ? 17 : 35
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// Typography
styles = html`
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap" rel="stylesheet">
<style>
svg, label, select, #result, #note {
font-family: 'Lato', sans-serif !important;
}
svg path {
stroke: hsla(69, 60%, 69%);
// Official
// stroke: #e7ff61;
}
rect {
fill: rgb(19, 196, 140);
// Official
// fill: #18dfa1;
stroke-width: 0;
}
#note .highlight {
color: #0fad7b;
font-weight: bold;
}
text {
pointer-events: none;
}
rect {
cursor: pointer;
}
</style>
`
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