Published
Edited
Mar 9, 2020
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
html`
<p><pre>
Transforms
</pre></p>
<svg class = "pinkcanvas">
<rect
width = 50
height = 50
fill = lightblue
stroke = black
transform = "translate(310,202.5)
rotate(45)
scale(1.5)"
/>
</svg>
`
Insert cell
html`
<p><pre>
Groups (Barbell)
</pre></p>
<svg class = "pinkcanvas">
<g transform = "translate(360,202.5)">
<g transform = "rotate(32)">
<circle
r = 100
fill = "lightblue"
stroke = black
transform = "translate(-150,0)scale(0.5)"/>

<line
stroke = black
stroke-width = 2
x1 = -100
y1 = 0
x2 = 100
y2 = 0 />

<circle
r = 100
fill = "lightblue"
stroke = black
transform = "translate(150,0)scale(0.5)"/>
</g>
</g>
/>
</svg>
`
Insert cell
Insert cell
Insert cell
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