Three.js JavaScript WebGL RendererΒΆ
A web-based interactive viewer using the Three.js JavaScript library maintained by https://threejs.org.
The viewer is invoked by adding the keyword argument viewer='threejs'
to the command
show()
or any three-dimensional graphic. The scene is rendered and displayed
in the users’s web browser. Interactivity includes
- Zooming in or out with the mouse wheel or pinching on a touch pad
- Rotation by clicking and dragging with the mouse or swiping on a touch pad
- Panning by right-clicking and dragging with the mouse or swiping with three fingers on a touch pad
The generated HTML file contains all data for the scene apart from the JavaScript library and can be saved to disk for sharing or embedding in a web page.
Options currently supported by the viewer:
aspect_ratio
– (default: [1,1,1]) list or tuple of three numeric values;-aspect is automatically reduced when large but can be overridden
axes
– (default: False) Boolean determining whether coordinate axes are drawnaxes_labels
– (default: [‘x’,’y’,’z’]) list or tuple of three strings; set to False to remove all labelscolor
– (default: ‘blue’) color of the 3d objectdecimals
– (default: 2) integer determining decimals displayed in labelsframe
– (default: True) Boolean determining whether frame is drawnopacity
– (default: 1) numeric value for transparency of lines and surfacesradius
– (default: None) numeric value for radius of lines; use to render lines thicker than available usingthickness
or on Windows platforms wherethickness
is ignoredthickness
– (default: 1) numeric value for thickness of lines
AUTHORS:
- Paul Masson (2016): Initial version
EXAMPLES:
Three spheres of different color and opacity:
sage: p1 = sphere(color='red', opacity='.5')
sage: p2 = sphere((-1,-1,1), color='cyan', opacity='.3')
sage: p3 = sphere((1,-1,-1), color='yellow', opacity='.7')
sage: show(p1 + p2 + p3, viewer='threejs')
A parametric helix:
sage: parametric_plot3d([cos(x),sin(x),x/10], (x,0,4*pi), color='red', viewer='threejs')
Graphics3d Object