Search code examples
javascriptjupyter-notebookrequiresvg.jsobservablehq

How to use svg.js on Observable notebook

I started learning to use Observable a few days ago.

I can use svg.js version 2.7.1 by using

SVG = require("svg.js") // 2.7.1

But when I try to use version 3.0.12, this doesn't work.

SVG = require("[email protected]")

The error is

SVG = rt: unable to load package.json

And when I try to load via url instead:

SVG = require("https://cdnjs.cloudflare.com/ajax/libs/svg.js/3.0.12/svg.js")

There's an error as well.

SVG = rt: invalid module

Is it possible to use svg.js v3 with Observable?

Please give some suggestions.

Solution

  • I test @svgdotjs/svg.js with the Module require debugger, and eventually find the solution

    SVG = (await import('https://unpkg.com/@svgdotjs/svg.js?module')).SVG
draw = SVG().addTo('#drawing').size('100%', 100)