stencila/designa

Node List: support rendering Plotly images

Closed this issue · 3 comments

One of the mimetypes used as an output of Jupyter Notebooks is application/vnd.plotly.v1+json, for the Plotly JSON Schema. This output has widespread use in Jupyter Notebooks and as such is a high priority for support.

I am presently working on support in Encoda but to support interactive Plotly figures in the browser we should add support here too. That work in Encoda will help shape the design of the necessary web component but whatever that is, it will require integration of the Plotly.js package.

This is a similar issue to #119 in that it adds support for another code chunk output type.

Unfortunately making use plotly.js is proving less straightforward than I hoped @nokome.
Due to issues with how it's packaged and old D3 versions, getting it working with modules/NPM imports isn't working.
The package size is also very large, so I don't want to include a blocking script tag everywhere any, even unrelated, Stencila components are used.

I'll see if someone has a fork of a new version of the library with the required code edit and if we can use that.

Otherwise I think a better and immediate solution would be to write a script loader shim. It would be run whenever the Plotly component is first referenced, pausing rendering of the component until dynamically loading of the script from a CDN is finished.

Uurgh, sorry to hear that @alex-ketch.

I thought that the bundle size would be large but hoped that code splitting would mean it would only be downloaded on demand, when needed. I certainly agree that we should not add a script tag everywhere. The script loader sound like a good solution though 👍

Closed by #123