The avatar for @utec5
Utec
Public
Edited
Mar 26
Fork of Fundamentos de SVG
1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
<svg width="500" height="100">
<circle cx="25" cy="50" r="3" fill="blue"/>
<circle cx="100" cy="75" r="4" fill="green"/>
</svg>
Insert cell
Insert cell
<svg width="500" height="100">
<g transform="translate(20, -25)">
<circle cx="25" cy="50" r="25" fill="blue"/>
<circle cx="100" cy="75" r="25" fill="red"/>
</g>
</svg>
Insert cell
Insert cell
<svg width="500" height="100">
<g transform="translate(100, -25)" fill="red">
<circle cx="25" cy="50" r="25" />
<circle cx="100" cy="75" r="25" />
</g>
</svg>
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
<svg width="190" height="160">
<path d="M 10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80" stroke="green" fill="transparent"/>
</svg>
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
html`<div style="background-color: gray; color: white; padding: 10px 20px; border-radius: 5px; font-size: 20px;">
Sebas
</div>`

Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
solution(``, 'html')
Insert cell
solution = (code, lang='javascript') => html`
<details>
<summary>Solution</summary>
${md`\`\`\`${lang}
${code}
\`\`\``}
</details>
`
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