Difference between revisions of "Jmol JavaScript Object/WebGL"
AngelHerraez (talk | contribs) (WebGL; alternatives) |
AngelHerraez (talk | contribs) (WebGL; alternatives) |
||
Line 24: | Line 24: | ||
== JmolScript features == | == JmolScript features == | ||
− | :''Please, if you have experienced with JSmol/ | + | :''Please, if you have experienced with JSmol/WebGL feel free to add items here.'' |
=== Supported === | === Supported === | ||
* ... | * ... | ||
Line 32: | Line 32: | ||
− | + | = WebGL-based alternatives to JSmol = | |
There are several programs able to display molecular structures using the WebGL technology. This is a list of some of them, and an attempt for comparison. | There are several programs able to display molecular structures using the WebGL technology. This is a list of some of them, and an attempt for comparison. | ||
Line 42: | Line 42: | ||
=== 3Dmol.js === | === 3Dmol.js === | ||
− | * Main page: <nowiki>http://3dmol.csb.pitt.edu/</nowiki> | + | * Main page: <nowiki>http://3dmol.csb.pitt.edu/doc/</nowiki> |
+ | * Demo: <nowiki>http://3dmol.csb.pitt.edu/</nowiki> | ||
* Article in ''Bioinformatics'', doi:10.1093/bioinformatics/btu829 | * Article in ''Bioinformatics'', doi:10.1093/bioinformatics/btu829 | ||
− | * | + | * Repository: <nowiki>https://github.com/3dmol/3Dmol.js</nowiki> |
+ | * Library available as a single JavaScript file (including or not jQuery) | ||
Has a very simple embedding mechanism, based on HTML markup or | Has a very simple embedding mechanism, based on HTML markup or | ||
url formatting. Abilities to compute isosurfaces in parallel (using web workers | url formatting. Abilities to compute isosurfaces in parallel (using web workers | ||
Line 51: | Line 53: | ||
=== PV Protein Viewer === | === PV Protein Viewer === | ||
+ | By Marco Biasini. Open source. | ||
* Main page: <nowiki>http://biasmv.github.io/pv/</nowiki> | * Main page: <nowiki>http://biasmv.github.io/pv/</nowiki> | ||
* Documentation: <nowiki>http://pv.readthedocs.org/en/latest/intro.html</nowiki> | * Documentation: <nowiki>http://pv.readthedocs.org/en/latest/intro.html</nowiki> | ||
− | * | + | * Repository: <nowiki>https://github.com/biasmv/pv</nowiki> |
Used by SwissModel and RCSB Protein Data Bank. Very clear documentation. Graphics are | Used by SwissModel and RCSB Protein Data Bank. Very clear documentation. Graphics are | ||
stylized but also really clear in their depiction. Common bio-molecular | stylized but also really clear in their depiction. Common bio-molecular | ||
Line 64: | Line 67: | ||
* Demonstration: <nowiki>http://proteinformatics.charite.de/ngl/html/ngl.html</nowiki> | * Demonstration: <nowiki>http://proteinformatics.charite.de/ngl/html/ngl.html</nowiki> | ||
* Article in ''Nucleic Acid Research'', doi:10.1093/nar/gkv402 | * Article in ''Nucleic Acid Research'', doi:10.1093/nar/gkv402 | ||
− | * | + | * Repository: <nowiki>https://github.com/arose/ngl</nowiki> |
Beautiful graphic capabilities. Many bio-molecular representations (some unique | Beautiful graphic capabilities. Many bio-molecular representations (some unique | ||
such as «hyperballs» and «ropes» ). Abilities to act on | such as «hyperballs» and «ropes» ). Abilities to act on | ||
Line 70: | Line 73: | ||
=== Chemdoodle Web Components === | === Chemdoodle Web Components === | ||
+ | Free product offered by iChemLabs, LLC, under open-source GPL license. | ||
+ | * Main page: <nowiki>https://web.chemdoodle.com/</nowiki> | ||
* Examples: <nowiki>https://web.chemdoodle.com/demos/iza-zeolite-explorer/</nowiki> <nowiki>http://www.glmol.com/</nowiki> | * Examples: <nowiki>https://web.chemdoodle.com/demos/iza-zeolite-explorer/</nowiki> <nowiki>http://www.glmol.com/</nowiki> | ||
− | Handles | + | Handles biomolecular representations and has some capabilities to handle cif |
files and generate multiple cells. Viewer canvases can be linked to a range of | files and generate multiple cells. Viewer canvases can be linked to a range of | ||
different widgets (spectrum display, 2D formula, etc.). Selection and display | different widgets (spectrum display, 2D formula, etc.). Selection and display | ||
Line 85: | Line 90: | ||
=== Speck === | === Speck === | ||
+ | By Rye Terrell. Public domain. | ||
* Main page: <nowiki>http://wwwtyro.github.io/speck/</nowiki> | * Main page: <nowiki>http://wwwtyro.github.io/speck/</nowiki> | ||
− | Offers | + | * Repository: <nowiki>https://github.com/wwwtyro/speck</nowiki> |
+ | Offers ambient occlusion rendering |
Revision as of 23:40, 7 November 2015
WebGL modality in JSmol
JSmol has tentatively implemented a modality (additional to the Java and the HTML5 modalities) that makes use of the WebGL technology.
- Please, note that this modality does not implement the full set of functionalities of Jmol/JSmol and there are no current plans to develop it further. Help from interested developers/programmers would be welcome.
WebGL is a hardware-accelerated technology for displaying 2D and 3D graphics inside web pages without using any plugins in the browser. It relies on capabilities of the user's graphics card, and so compatibility may be limited, although it is a growing standard feature.
The major advantage of using WebGL is a faster and smoother rendering of the model, rotation, movement, etc., over that obtained with JSmol/HTML5. In exchange, the latter offers a wider compatibility with devices.
Hardware support
Old graphics cards may not support WebGL.
Browser support
Browser support is irregular, although growing. Chrome, Safari, Edge are compatible, Firefox may be depending on graphics card drivers. Please check e.g. Can I use for current status.
Implementing the WebGL modality
You need to be aware that your users/visitors might not have a WebGL-compatible system, so be cautious with your design and offer alternatives.
In order to have JSmol in your pages use the WebGL modality:
- your page should call JSmol.GLmol.min.js in addition to JSmol.min.js
- the
use
parameter of theInfo
variable must be set toWebGL
(case-insensitive)
JmolScript features
- Please, if you have experienced with JSmol/WebGL feel free to add items here.
Supported
- ...
Not supported
- background color is ignored; always transparent
- ...
WebGL-based alternatives to JSmol
There are several programs able to display molecular structures using the WebGL technology. This is a list of some of them, and an attempt for comparison.
GLmol
- Main page: http://webglmol.osdn.jp/index-en.html
Might have been the first WebGL viewer available. Some of its code has been used in the JSmol WebGL modality. Active development has apparently ceased.
3Dmol.js
- Main page: http://3dmol.csb.pitt.edu/doc/
- Demo: http://3dmol.csb.pitt.edu/
- Article in Bioinformatics, doi:10.1093/bioinformatics/btu829
- Repository: https://github.com/3dmol/3Dmol.js
- Library available as a single JavaScript file (including or not jQuery)
Has a very simple embedding mechanism, based on HTML markup or url formatting. Abilities to compute isosurfaces in parallel (using web workers that donât hang the web browser during the computation). Displays most common bio-molecular representations, labels, select and color abilities.
PV Protein Viewer
By Marco Biasini. Open source.
- Main page: http://biasmv.github.io/pv/
- Documentation: http://pv.readthedocs.org/en/latest/intro.html
- Repository: https://github.com/biasmv/pv
Used by SwissModel and RCSB Protein Data Bank. Very clear documentation. Graphics are stylized but also really clear in their depiction. Common bio-molecular representations are available. Selections are based on javascript and a JSON syntax.
NGL
by Alexander Rose
- Main page: http://arose.github.io/ngl/doc/#User_manual/Introduction/Welcome
- Demonstration: http://proteinformatics.charite.de/ngl/html/ngl.html
- Article in Nucleic Acid Research, doi:10.1093/nar/gkv402
- Repository: https://github.com/arose/ngl
Beautiful graphic capabilities. Many bio-molecular representations (some unique such as «hyperballs» and «ropes» ). Abilities to act on selections with a Jmol-like syntax.
Chemdoodle Web Components
Free product offered by iChemLabs, LLC, under open-source GPL license.
- Main page: https://web.chemdoodle.com/
- Examples: https://web.chemdoodle.com/demos/iza-zeolite-explorer/ http://www.glmol.com/
Handles biomolecular representations and has some capabilities to handle cif files and generate multiple cells. Viewer canvases can be linked to a range of different widgets (spectrum display, 2D formula, etc.). Selection and display is based on the manipulation of JavaScript objects.
iview
By Li, Leung, Nakane and Wong, Chinese University of Hong Kong
- Main page: http://istar.cse.cuhk.edu.hk/iview/
molmil
Backed by Protein Data Bank Japan
- Main page: http://pdbj.org/help/molmil
Speck
By Rye Terrell. Public domain.
- Main page: http://wwwtyro.github.io/speck/
- Repository: https://github.com/wwwtyro/speck
Offers ambient occlusion rendering