Support for Notebook HTML Export #80
Comments
|
Hi @Phocion! If you're using it and manage to create some cool visualizations and interactions between native widgets and ipycytoscape with your use case I'd be very interested in having it in the https://voila-gallery.org/! Don't hesitate to ping me for a quick chat or in github if you run to any issues. |
|
I think Voila runs a python kernel underneath to enabled continued interaction with python? So its not quite the same as exporting to standalone HTML. Correct me if I'm wrong but I think @Phocion is talking about
You need to use the CLI due to a difference in the nbconvert cli and python api detailed here: jupyterlab/jupyterlab#7262 I followed the above to embed the cola example into an standalone html file in this zip: I wonder how hard it would be to have a method on the widget like |
|
A minimal embedding is not so hard it turns out, most of the NBconvert output can be removed without consequence (there's like 10000 lines of css). The widget state gets saved in a script tag and then all you need is the html below. It's probably also possible to get that widget state from within python, but idk how. <!DOCTYPE html>
<html>
<head><meta charset="utf-8" />
<title>Cola example</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.min.js"></script>
<script>
(function() {
function addWidgetsRenderer() {
var mimeElement = document.querySelector('script[type="application/vnd.jupyter.widget-view+json"]');
var scriptElement = document.createElement('script');
var widgetRendererSrc = 'https://unpkg.com/@jupyter-widgets/html-manager@*/dist/embed-amd.js';
var widgetState;
// Fallback for older version:
try {
widgetState = mimeElement && JSON.parse(mimeElement.innerHTML);
if (widgetState && (widgetState.version_major < 2 || !widgetState.version_major)) {
widgetRendererSrc = 'https://unpkg.com/jupyter-js-widgets@*/dist/embed.js';
}
} catch(e) {}
scriptElement.src = widgetRendererSrc;
document.body.appendChild(scriptElement);
}
document.addEventListener('DOMContentLoaded', addWidgetsRenderer);
}());
</script>
</head>
<body>
<script type="application/vnd.jupyter.widget-view+json">
{"model_id": "ab5aaa0452754cf9ae1d3905a743e3dc", "version_major": 2, "version_minor": 0}
</script>
</body>
<script type="application/vnd.jupyter.widget-state+json">
{"state": {"005090b598af4b7580b05745803d2862": {"model_module":
....
....
.... |
|
Has there been an update to this? Is it still open? |
|
Hi @rohanvarm, could you please tell me about your use case? |
Really appreciate this project for bringing much-needed graph interactivity to Jupyter.
Was wondering if there are plans to have the graph exported properly into HTML notebook exports? Something akin to Plotly's plotly.offline.iplot(...) function. I recall needing one additional step to get interactive Plotly plots to export correctly in Jupyter Notebook HTML exports:
https://blog.matteoferla.com/2019/06/exporting-jupyter-notebooks-with-plotly.html
The target audience who would make good use of these graphs in HTML reports don't use Jupyter Notebooks and wouldn't use it as a medium to explore them. So it would be a vital feature to make available such that the exports show the analysis results for interpretation.
(And I'm not including ipywidgets interactivity here - just the graph itself as it would appear embedded in a normal HTML webpage.)
Is this doable?
Many thanks!
The text was updated successfully, but these errors were encountered: