jupyter-widgets / pythreejs

A Jupyter - Three.js bridge
https://pythreejs.readthedocs.io
Other
951 stars 188 forks source link

file -> Download As -> html #144

Closed janba closed 6 years ago

janba commented 6 years ago

I give up.

The ability to save a notebook with interactive graphics as a static HTML page seems to be one of the most useful applications of pythreejs and it seems that it should work since the graphics would be pure JS - unlike a widget that would feed back into the python code .. but I cannot make it work despite my best efforts.

I simply go file -> Download As -> html

and I get a nice HTML version of the notebook without the WebGL.

It is running on a version of master that is up to date.

Is there some magic sauce (or source) that needs to be applied in order to unlock this possibility?

Best Andreas

vidartf commented 6 years ago

In principle it should work if you first click "Save Notebook Widget State" in the "Widgets" menu, but that functionality isn't completely working yet in master (I just got it working for documentation in #143). Hopefully it will be in place for the next release!

vidartf commented 6 years ago

As far as I can tell, this issue is upstream (https://github.com/jupyter/nbconvert/issues/636). After that has gone in, this should work for released versions of pythreejs (needs to be on CDN).

janba commented 6 years ago

Thanks. I think this is an amazing tool, but I am really very challenged. Trying to perhaps make it work I downgraded to 0.4.1 and now nothing works (now graphics what so ever) because of some incompatibility. From the javascript console.

Unhandled Promise Rejection: Class GeometryModel not found in module jupyter-threejs

this seems to be on import. On rendering, I get:

Unhandled Promise Rejection: TypeError: this.options.render_frame is not a function. (In 'this.options.render_frame()', 'this.options.render_frame' is undefined

Now this has persisted even through a jump from pip to conda. It appears that the 3.js library and the pythreejs library are out of sync, but for the life of me I cannot figure out where the issue lies. Having basically reinstalled everything, you would think that the problem had gone away

janba commented 6 years ago

Sorry. Disregard the comment above. This was due to me having forgotten that we must use FaceGeometry and not Geometry when creating a Geometry from a triangle mesh. So, now I am back to having a nice view of my mesh in jupyter notebook using 0.4.1 but when exporting to HTML the geometry is gone and the Javascript console informs me that it cannot find or load several resources. The errors are included below if that is helpful.

If I understand correctly, this is a known issue in nbconvert that will be resolved? ... and which can in principle be fixed by adding appropriate files to the directory of the HTML file?

Thanks for your comments and insights!

[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/Scattered/custom.css (scattered-terrain-data-interpolation.html, line 11746)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/bootstrap/fonts/glyphicons-halflings-regular.woff2
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/bootstrap/fonts/glyphicons-halflings-regular.woff
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/bootstrap/fonts/glyphicons-halflings-regular.ttf
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/bootstrap/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/font-awesome/fonts/fontawesome-webfont.woff?v=4.2.0
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/font-awesome/fonts/fontawesome-webfont.ttf?v=4.2.0
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/components/font-awesome/fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular
    Load (MathJax.js:19:12993)
    Require (MathJax.js:19:12731)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    Config (MathJax.js:19:45696)
    execute (MathJax.js:19:3248)
    cb (MathJax.js:19:2825)
    Process (MathJax.js:19:8682)
    Push (MathJax.js:19:8482)
    (anonymous function) (MathJax.js:19:62112)
    Global Code (MathJax.js:19:62390)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/Scattered/@jupyter-widgets/base.js
    load (require.min.js:34:143)
    load (require.min.js:29:269)
    load (require.min.js:18)
    fetch (require.min.js:17:481)
    check (require.min.js:19:477)
    enable (require.min.js:23:244)
    enable (require.min.js:27:475)
    (anonymous function) (require.min.js:23:117)
    (anonymous function) (require.min.js:8:108)
    v (require.min.js:7:175)
    enable (require.min.js:22:243)
    init (require.min.js:17)
    (anonymous function) (require.min.js:26:374)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/Scattered/underscore.js
    load (require.min.js:34:143)
    load (require.min.js:29:269)
    load (require.min.js:18)
    fetch (require.min.js:17:481)
    check (require.min.js:19:477)
    enable (require.min.js:23:244)
    enable (require.min.js:27:475)
    (anonymous function) (require.min.js:23:117)
    (anonymous function) (require.min.js:8:108)
    v (require.min.js:7:175)
    enable (require.min.js:22:243)
    init (require.min.js:17)
    E (require.min.js:14:197)
    completeLoad (require.min.js:28:127)
    onScriptLoad (require.min.js:29:449)
[Error] Not allowed to load local resource: file:///Users/janba/Teaching/02580/02580-pysrc/Scattered/ndarray.js
    load (require.min.js:34:143)
    load (require.min.js:29:269)
    load (require.min.js:18)
    fetch (require.min.js:17:481)
    check (require.min.js:19:477)
    enable (require.min.js:23:244)
    enable (require.min.js:27:475)
    (anonymous function) (require.min.js:23:117)
    (anonymous function) (require.min.js:8:108)
    v (require.min.js:7:175)
    enable (require.min.js:22:243)
    init (require.min.js:17)
    E (require.min.js:14:197)
    completeLoad (require.min.js:28:127)
    onScriptLoad (require.min.js:29:449)
[Error] Failed to load resource: the server responded with a status of 404 (HTTP/2.0 404) (index.js, line 0)
[Error] Failed to load resource: the server responded with a status of 404 (HTTP/2.0 404) (index.js, line 0)
[Error] Did not load script at 'https://unpkg.com/@jupyter-widgets/base@0.3.0-alpha.0/dist/index.js' because non script MIME types are not allowed when 'X-Content-Type: nosniff' is given.
[Error] Error: Script error for: https://unpkg.com/@jupyter-widgets/base@0.3.0-alpha.0/dist/index.js
http://requirejs.org/docs/errors.html#scripterror
    da (require.min.js:8:145)
    w (require.min.js:12:327)
    onScriptError (require.min.js:29:514)
vidartf commented 6 years ago

Yes, once the nbconvert issue is resolved this should work. Closing for now.