Converting widgets to static png

[maartenbreddels]

For various reasons, people want to be able to convert a widget to a PNG

• Rendering of thumbnails for sphinx-gallery
• nbconvert rendering to png
• rendering on github
• Provide a preview of the widget while the page/notebook is rendering

Some work has been done in jupyter/nbconvert#901 but it led to too much library specific code ending up there, for instance

• for bqplot, I am copying it's to_png code
• for jupterleaflet we need to wait till the maps are loaded
• ipyvolume actually is not properly supported on osx (framebuffer gets lost, i have a local hack).
• A VBox would need to wait till its children are rendered.

The solution would be, to have an API for the DOMWidgetView, that makes a screenshot of itself (lets assume html2canvas here. Widgets that need specific behaviour, like VBox, bqplot's Figure, could implement that.

@SylvainCorlay also proposed an way to get a 'static' DOM clone of the view, for instance, for bqplot that would be the self contained svg version of itself. Maybe he could elaborate a bit more on this vision.

Previous work

#314 included a superset of this, I'd like to only add an API for this. The interface for converting to static widget/screenshot, or making screenshots as discussed in #1291 could be attacked in a different PR.

[psychemedia]

Another variant on this is the ability to capture and export any cell output, such as a styled pandas dataframes (richly styled HTML tables), as a png.

Rationale: styled tables may include things like graphical items. Exporting to simple markdown that expects simple markdown style tables will lose the rich styling / image embeds. In such a case, a graphic variant of the table provides a useful alternative.

Possibly related packages / techniques:

• https://stackoverflow.com/questions/38425931/download-table-as-png-using-jquery/40644383#40644383
• https://tableexport.v5.travismclarke.com/#tableexport
• https://html2canvas.hertzen.com/ / https://github.com/niklasvh/html2canvas
• https://w3lessons.info/export-html-table-to-excel-csv-json-pdf-png-using-jquery/ export to pdf
• https://github.com/simonbengtsson/jsPDF-AutoTable

[casperdcl]

Related: convert widgets to pretty text.

Is there any way to manually specify how to convert a widget into plain text for non-HTML display? Specifically I was thinking about inheriting/adding HBox._repr_latex_ which doesn't seem to work. Even more specifically, I'm referring to tqdm/tqdm#937 and this work-around: tqdm/tqdm#937 (comment)

I'd like to know if overriding __repr__ is the correct way to specify text-only display in all non-HTML cases:

class MyWidget(SomeIPYWidget):
    def __repr__(self):
        return convert_to_markdown_table(self)

[KelSolaar]

Very much interested in that, I would like to be able to export the full widget with the page theme also because it is an important piece in the look I need to reproduce.

[asaboor-gh]

For various reasons, people want to be able to convert a widget to a PNG

• Rendering of thumbnails for sphinx-gallery
• nbconvert rendering to png
• rendering on github
• Provide a preview of the widget while the page/notebook is rendering

Some work has been done in jupyter/nbconvert#901 but it led to too much library specific code ending up there, for instance

• for bqplot, I am copying it's to_png code
• for jupterleaflet we need to wait till the maps are loaded
• ipyvolume actually is not properly supported on osx (framebuffer gets lost, i have a local hack).
• A VBox would need to wait till its children are rendered.

The solution would be, to have an API for the DOMWidgetView, that makes a screenshot of itself (lets assume html2canvas here. Widgets that need specific behaviour, like VBox, bqplot's Figure, could implement that.

@SylvainCorlay also proposed an way to get a 'static' DOM clone of the view, for instance, for bqplot that would be the self contained svg version of itself. Maybe he could elaborate a bit more on this vision.

Previous work

#314 included a superset of this, I'd like to only add an API for this. The interface for converting to static widget/screenshot, or making screenshots as discussed in #1291 could be attacked in a different PR.

Looks like this still doesn't have solution in 2021. You can capture screenshot using PIL, but need bounding box for that. I don't think it's too much extra work to include such information in widget itslef which could be accessed in python side. I can, technically share a value between python and JavaScript through a widget, but that doesn't work in all frontend, e.g IPython.display.Javascript works in Jupyter lab, but Voila and VScode complain that JavaScript is disabled in Jupyter lab ( fantastic joke!).
So a better solution is widget should be aware of it's screen position in python side too, so that people can implement their own ways handling other views type. No idea if somebody working on this aspect or not