Public
Edited
Apr 16
Insert cell
Insert cell
Insert cell
<svg width="1100" height="1100">
<style>
/* edit these styles as you need - this is a starting point*/
rect {stroke: white; stroke-width: 2px;}
text {fill: white; font-family: 'Rajdhani', sans-serif;}
.maintitle {font-size: 39px; fill: black;}
.mainsubtitle {font-size: 18px; fill: black;}
.title {text-anchor: end; font-size: 32px;}
.subtext1, .subtext2, .subtext3 {}
.footprint {font-size: 17px;}
line {stroke: white; stroke-width: 2px;}
</style>

<text x="0" y="27" class="maintitle">Main title-this can be static</text>
<text x="0" y="50" class="mainsubtitle">Subtitle...</text>

<!-- the rest will be drawn by the data using D3 below -->
</svg>
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
colors = ["#a5620b","#c29657","#cc1f5e","#a71949","#f7991d","#231f20"];
// in order Large Dog to Hamster. Reference as colors[i]
Insert cell
Insert cell
land_guzzlers.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
<link href="https://fonts.googleapis.com/css?family=Rajdhani" rel="stylesheet">
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