[TW5] Developing a Plotly plugin--input appreciated!

[Shane Leonard]

Hi all,

As it seems there is a lack of good plotting/visualization libraries for TW5 (besides vis), I am trying to make a simple plot.ly js wrapper for TW5 along with a <$plotly> widget.

However, as this is my first real TW5 plugin, I'm struggling in some respects, and would love some input.

So far, I've wrapped the plotly.js library in an IIFE which provides 'document' as either $tw.fakeDocument if building under node, or window.document for the browser. I'm building the plugin according to this guide from the developer documentation, but I keep running into the limitations of $tw.fakeDocument. For instance, in the plotly library, there's a line which executes 

document.head.appendChild(/*...*/)

When I try to build the index.html, I get an error complaining that appendChild doesn't exist for 'undefined'. I can try working through errors like this one by one, but it seems this is fundamentally to do with the limitations of $tw.fakeDocument. (Also, the ploty javascript library is >150,000 lines of code, so I REALLY don't want to have to modify the original library at all). Is there a way for me to develop this plugin such that it doesn't build for node but it does work on the browser? Or is there something I'm overlooking?

Thanks,

Shane

[Tobias Beer]

Hi Shane,

Chances are that you may not be able to get plotly to work properly w/o a full fledged browser DOM, i.e. that it is not designed in a way to work without a full DOM implementation. In other words, you may want to focus on getting it to work but in a served or otherwise built html representation.

Best wishes,

Tobias.

[Shane Leonard]

Hi Tobias,

Thank you for the quick response! As I understand it, would I accomplish this by just basically wrapping the whole library in `if (!$tw.node) {}`? To build a served version, do I still use the `node ./tiddlywiki.js editions/tw5.com-server --build index` as outlined in the developer docs?

Thanks,

Shane

[Tobias Beer]

Hi Shane,

Thank you for the quick response! As I understand it, would I accomplish this by just basically wrapping the whole library in `if (!$tw.node) {}`? To build a served version, do I still use the `node ./tiddlywiki.js editions/tw5.com-server --build index` as outlined in the developer docs?

Sure, you will still use node to build your plugin / demo edition from components, but your code that initializes and runs plotly probably will need some conditional to check whether the runtime is suitable for execution. Not sure if the right conditional is `if (!$tw.node) {}`, though. Never did this before or had to, hopefully. ;-)

Best wishes,

Tobias.