How can I access the course code that Sagemath uses for its Threejs back-end

asked 2020-06-13 20:17:52 +0100

jakeb
21 ●1

Hi guys. I have been using sagemath for a while because it has (in my opinion) the best back-end for 3d plots of any software I have seen so far. The threejs plots it outputs are gorgeous and very interactive. That said, there are a few things that sagemath has not yet implemented for threejs that I would like to make it do, but I am unsure where I can actually find the code that defines the back-end that sage uses to actually generate its threejs stuff. Does anyone happen to know how I could figure this out, or if there is a quicker way than just meticulously scouring the source code?

Best Regards, Jake

edit retag flag offensive close merge delete

add a comment

2 Answers

Sort by » oldest newest most voted

answered 2020-06-15 22:10:41 +0100

jcamp0x2a
41 ●3 ●2

dan_fulea's answer above is great advice for searching the source code of Sage as well as other places with the other functions he mentioned. I've worked on a few bug fixes / features for the three.js viewer, so I can perhaps point you to more specific locations:

The front-end consists of a single template HTML file containing the JavaScript that's used to render and manipulate the 3D scene. It's located at src/sage/ext_data/threejs/threejs_template.html.

The best place to start looking on the back-end is src/sage/plot/plot3d/base.pyx. Within, there's a Graphics3d class, and inside it is the _rich_repr_threejs method. Briefly, this method collects viewing options set by the user or defaults; builds up the points, lines, surfaces, and texts used in the scene; and inserts those options and the scene data into a copy of the HTML from the template.

How the resulting HTML gets saved to a file and launched in your browser, I'm less knowledgeable of, but output_browser.py, output_graphics3d.py, and buffer.py in src/sage/repl/rich_output/ may be good places to look.

Any features or bug fixes you contribute would be greatly appreciated! If you create a ticket over at trac dot sagemath dot org (can't seem to post a link) for such changes, consider CC'ing paulmasson as he's the creator of the three.js viewer and is who I've been most in contact with regarding it. And feel free to CC me as well: gh-jcamp0x2a.

edit flag offensive delete link

Comments

Hi! thanks so much for this! Actually, I was already considering reaching out to you. I have been trying to render large 3d animations from parametric equations, and since I posted this, I came across your trac describing the work that you had done on it so far. (https://trac.sagemath.org/ticket/29194) Funnily enough, you seemed to arrive at essentially the same method as I did for generating animated 3d plots (that is, keyframing every separate plotted set of points to be invisible for any frame but the one it is meant to be shown on). Might I ask a few questions about how you have been making your three-js-based animation function? If there is any way I could help, I'd love to do so.

jakeb ( 2020-06-17 21:49:58 +0100 )edit

Absolutely! I try to check this site every couple days, but the trac ticket you mentioned or email would probably be a better forum. My email's not hard to guess from my username: just @gmail.com.

If you have any example code or animated plots built up, perhaps we can compare and see if there's any functionality/ideas/use-cases we can incorporate from each other's work. Another pair of eyes on the code for review or any additional testing is always welcome, too.

jcamp0x2a ( 2020-06-18 17:51:22 +0100 )edit

add a comment

answered 2020-06-15 16:16:17 +0100

dan_fulea
5537 ●5 ●43 ●95

updated 2020-06-15 16:16:48 +0100

Often, i also want to search the source code for some specific "notion", in the present case it is threejs, and the following search request may be helpful (or at least the begin of search path...)

search_src('threejs')

(Note that sage provides also search_doc and search_def...)

Then a long list of case insensitive occurences for the string threejs is given. Sometimes we get lines involving threejs as a substing of the name of a function or method, sometimes as part of a doc string, sometimes as the name of the viewer, sometimes a substring of a file path, et caetera...

At any rate, the corresponding mentioned modules have some (name) connection with threejs...

Note:

To have a first impression of what is delivered, here are the first few lines from the output:

sage: search_src('threejs') 

env.py:193:var('THREEJS_DIR',                   join(SAGE_SHARE, 'threejs'))
repl/rich_output/backend_ipython.py:195:            OutputSceneJmol, OutputSceneWavefront, OutputSceneThreejs,
repl/rich_output/backend_ipython.py:273:        elif isinstance(rich_output, OutputSceneThreejs):
repl/rich_output/backend_ipython.py:400:    def threejs_offline_scripts(self):
repl/rich_output/backend_ipython.py:412:            sage: backend.threejs_offline_scripts()
repl/rich_output/backend_ipython.py:415:        from sage.env import THREEJS_DIR
repl/rich_output/backend_ipython.py:418:            os.path.join(THREEJS_DIR, script)
repl/rich_output/backend_ipython.py:503:            OutputSceneJmol, OutputSceneThreejs,
repl/rich_output/backend_ipython.py:579:        elif isinstance(rich_output, OutputSceneThreejs):
repl/rich_output/backend_ipython.py:592:    def threejs_offline_scripts(self):
repl/rich_output/backend_ipython.py:604:            sage: backend.threejs_offline_scripts()
repl/rich_output/backend_ipython.py:605:            '...<script src="/nbextensions/threejs/build/three.min...<\\/script>...'
repl/rich_output/backend_ipython.py:608:        CDN_scripts = get_display_manager().threejs_scripts(online=True)
repl/rich_output/backend_ipython.py:610:<script src="/nbextensions/threejs/build/three.min.js"></script>
repl/rich_output/backend_ipython.py:611:<script src="/nbextensions/threejs/examples/js/controls/OrbitControls.js"></script>
repl/rich_output/output_graphics3d.py:172:class OutputSceneThreejs(OutputBase):
repl/rich_output/output_graphics3d.py:184:            sage: from sage.repl.rich_output.output_catalog import OutputSceneThreejs
repl/rich_output/output_graphics3d.py:185:            sage: OutputSceneThreejs('<html></html>')
repl/rich_output/output_graphics3d.py:186:            OutputSceneThreejs container
repl/rich_output/display_manager.py:718:    def threejs_scripts(self, online):
repl/rich_output/display_manager.py:739:            sage: get_display_manager().threejs_scripts(online=True)
repl/rich_output/display_manager.py:741:            sage: get_display_manager().threejs_scripts(online=False)
repl/rich_output/display_manager.py:745:            offline threejs graphics
repl/rich_output/display_manager.py:749:            with open(os.path.join(sage.env.THREEJS_DIR, 'build', 'three.min.js')) as f:

and so on... Any extension of the today graphical features is welcome!

edit flag offensive delete link

Comments

Hi, this is very helpful. thanks so much!

jakeb ( 2020-06-15 20:17:51 +0100 )edit

add a comment

Your Answer

Please start posting anonymously - your entry will be published after you log in or create a new account.

Add Answer

How can I access the course code that Sagemath uses for its Threejs back-end

2 Answers

Comments

Comments

Your Answer

Question Tools

Stats

How can I access the course code that Sagemath uses for its Threejs back-end edit

2 Answers

Comments

Comments

Your Answer

Question Tools

Stats

How can I access the course code that Sagemath uses for its Threejs back-end