SVG cells in Pluto

After a bit of experimental exploring I discovered partly by accident that you can have SVG cells in Pluto. Here is some example text for a Pluto cell to illustrate what I mean:

html"""
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
"""

Of course this implies it is an html cell which includes svg code.
html is needed in place of md as otherwise md would just display the svg text.

:question: May be I have not looked in the right places but I have not seen this documented, so may be I am missing a more correct or better alternative way of displaying SVG?

My motivation for this is that I sometimes like to make ‘back of the envelope or napkin’ type sketches and diagrams of what I am trying to do programmatically, which would more ideally be done with a stylus on a tablet computer running an SVG editor app, then the SVG code could be copied into the Pluto cell to include illustrations in the Pluto notebook.

(The SVG code above is from w3schools)

5 Likes