Render an image of the graph when I view my notebook in GitHub or export the notebook as PDF

[agryman]

First, this widget is great! Thanks.

I often share a static copy of my data analysis notebooks as either HTML or PDF. For example, I send people links to the notebook stored in GitHub which does a good job of rendering most content. However, the yFiles widget gets rendered as:

GraphWidget(layout=Layout(height='500px', width='100%'))

It would be very useful if the widget was rendered as an image. This would allow people to view the graph without setting up a notebook server.

[yGuy]

Thanks! Not sure if this is possible, though. At least it is far from trivial, as the graphics are rendered on the client and the HTML or PDF view is created on the notebook server, so we would somehow need to send back the graphics from the client to the server for potential storage in the notebook, just in case it will be exported some day. This would dramatically increase the size of the notebooks, even when you don't export them. So I think this is not feasible, even if we were to manage the client pushes image to server interaction.

If anybody has an idea how to implement that (or knows someone who might know that), please do send us feedback, here.

With that being said, you can use Google Colab or similar public Notebook servers and share the URL to your publicly hosted notebook. That works pretty well and will enable interactivity, too.

[agryman]

@yGuy Is there a way to export the current view as an image? Maybe an Export button in the widget? Then a user could manually insert the exported image in another notebook cell?

[yGuy]

You can use the "open in yed-live" button, which opens the graph in another browser tab in our web app (the graph stays in your browser and never touches our servers - it is sent via tab-to-tab-in-browser messaging).

yEd live has many different export options for exporting the graph to SVG, PDF, or PNG. And you can tweak it manually, too.

[agryman]

@yGuy Thanks for the suggestion. I'll try it.

[agryman]

@yGuy I tried yEd Live. I exported the graph in all 3 formats and tried inserting the images in my Jupyter notebook using the Edit -> Insert command which embeds the image as an attachment. The notebook would only import PNG (3.7 MB) and SVG (610 KB), but not PDF (353 KB). I imported the SVG and PNG in separate cells and then viewed the notebook on GitHub. The PNG image was displayed correctly but not the SVG. This is probably a bug in the GitHub notebook viewer. Too bad. I would have preferred PDF since it was the smallest file size.

In summary, I now have a path via yEd Live and PNG to get a representation of the graph for people viewing it on GitHub. However, this process adds manual steps and makes the notebook much more bulky.

Here is my "dream" solution. You add a button, e.g. "Set Print Preview", to the widget that takes a snapshot of the current view and embeds it in the notebook in way that the GitHub viewer can display it. Ideally, use PDF to minimize the file size. This same snapshot would be used when you run the Jupyter File->Print Preview or File->Download As commands.