Difference between revisions of "JSmol"

From Jmol
Jump to navigation Jump to search
(update on JSmol needs and syntax)
(link to PlatformSpeed)
 
(18 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
'''JSmol''' is the name for an alternative to Jmol applet that does not require Java but instead renders the molecular models in a webpage using just JavaScript and HTML5 features. This opens up the use of Jmol not only in PC's, Mac's and Linux's systems without Java installed, but also in tablets and phones (iOS, Android) that do not allow Java or applets. No hardware-based graphics acceleration is used either, and hence it should run in any system that supports HTML5 standards in the web browser. JSmol runs entirely in the client, does not use any server technologies.
+
JSmol is a JavaScript framework that allows web developers to create pages that utilize either Java or HTML5 (no Java), at will. This enables Jmol to display interactive 3D molecular structures on devices that do not have Java installed, or for which Java is not available (such as smart phones and some tablet computers, e.g. iPad) or has not been installed because of concerns for Java being a [http://proteopedia.org/w/Java#Java_is_a_security_threat security threat].
  
−
JSmol allows rendering, scripting and interaction with the models just as Jmol does, since the source code is shared by both. Note that JSmol is not a different program than Jmol: it is Jmol, just compiled into JavaScript instead of Java (thanks to the [http://java2script.sourceforge.net/ Java2Script] software).  
+
JSmol/HTML5 (no Java) is virtually identical to JSmol/Java in terms of rendering. The Java mode gives faster performance and smoother rotation than the HTML5 mode by a factor of 6 to 10, typically. In many cases this is not noticeable. Where it is noticed is with rending structures involving 20,000+ atoms or with surface creation. Rendering in the HTML5 mode can be sped up substantially with judicial use of [[PlatformSpeed]].  
  
−
Current limitations:
+
More information about JSmol:
−
* Using local files (i.e. not in a web server) may not be feasible depending on the browser (security policies).
 
−
* Opening binary files (e.g Spartan files, gzipped files, PNGJ files):
 
−
** Binary files can be read, but not all file types are identified yet, only those that match a few file extensions; if you rename any file to include <code>.bin</code> in its name, that will instruct JSmol to read it as a binary file. For example, <code>c6h6.bin.spartan</code> should work.
 
−
** For binary file reading to be compatible with Chrome and MSIE, you will need to have a base64 server-side piece that will convert the binary data to BASE64 format. This is because only Firefox allows clean (reliable) synchronous binary file transfer. The [http://chemapps.stolaf.edu/jmol/jsmol/jsmol.htm demo pages] use a [http://chemapps.stolaf.edu/jmol/jsmol/jsmol.php jsmol.php file], which does that and considerably more.
 
−
* Writing of JPG and PNG data is not supported directly (but see [[Recycling_Corner#Exporting_an_image_from_the_applet|Exporting an image]]).
 
−
* Background images are not supported.
 
  
−
When used together with [[Jmol JavaScript Object]] (Jmol-JSO), the same webpage may be authored to run in all devices using in each case a Jmol variety or surrogate that is adjusted to capabilities of each device.
+
*[[Jmol JavaScript Object]]: A full discussion of what JSmol is and how it can be implemented on a web page. Technical information about the libraries used to implement both the Java and HTML5 modes and to interact with them via scripts and user interface controls such as buttons, links, and menus.
 +
: Maybe you want to go straight to
 +
:* [[Jmol_JavaScript_Object/Functions|Functions for Jmol JavaScript Object]]
 +
:* [[Jmol_JavaScript_Object/Info|Detailed explanation of the parameters included in the Info variable]]
  
−
JSmol is still in a development stage, although mostly functional (Feb. 2013). You can see it in action at the [http://chemapps.stolaf.edu/jmol/jsmol/jsmol.htm test page]. Preliminary releases may be obtained at [http://sourceforge.net/projects/jsmol/ the JSmol Project page] and the latest development set of files from [http://chemapps.stolaf.edu/jmol/jsmol.zip St. Olaf].
+
*[[JSmol pros and cons]] describes the problems JSmol has with large models and certain web browsers.
  
 +
*[http://proteopedia.org/w/Java Proteopedia page on using Java in relation to Jmol].
  
−
The code you must include in your pages is like this:
 
  
−
In the <code>head</code> section:
+
<table style="width:100%;">
−
<script type="text/javascript" src="JSmol.min.js"></script>
+
<tr>
−
<script type="text/javascript">
+
<td style="width:25%; vertical-align:top;">
−
var Info = {
+
{{Installing_Jmol}}
−
  width: 300,
+
</td>
−
  height: 300,
+
<td style="width:50%; vertical-align:top;">
−
  serverURL: "<nowiki>http://chemapps.stolaf.edu/jmol/jsmol/jsmol.php</nowiki>",
+
{{Running_Jmol}}
−
  use: "HTML5",
+
<div style="margin-top:0.7em;"></div>
−
  j2sPath: "j2s",
+
{{Tutorials}}
−
  console: "myJmol_infodiv"
+
</td>
−
}
+
<td style="width:25%; vertical-align:top;">
−
</script>
+
{{Jmol_Documentation}}
−
 
+
</td>
−
Please note that although a single JavaScript file is invoked, you must have available in your server the full set contained in the download, since additional components of JSmol will be called as needed by that initial {{file|JSmol.min.js}} file. (The total size is around 3 MB, but only those components needed will be downloaded to the user's machine.)
+
</tr>
−
 
+
</table>
−
See [[Jmol_JavaScript_Object]] for more details about the <code>Info</code> variable.
 
−
 
 
−
And in the <code><body></code> section:
 
−
<script type="text/javascript">
 
−
  myJmol = Jmol.getApplet("myJmol", Info);
 
−
</script>
 

Latest revision as of 23:43, 20 November 2015

JSmol is a JavaScript framework that allows web developers to create pages that utilize either Java or HTML5 (no Java), at will. This enables Jmol to display interactive 3D molecular structures on devices that do not have Java installed, or for which Java is not available (such as smart phones and some tablet computers, e.g. iPad) or has not been installed because of concerns for Java being a security threat.

JSmol/HTML5 (no Java) is virtually identical to JSmol/Java in terms of rendering. The Java mode gives faster performance and smoother rotation than the HTML5 mode by a factor of 6 to 10, typically. In many cases this is not noticeable. Where it is noticed is with rending structures involving 20,000+ atoms or with surface creation. Rendering in the HTML5 mode can be sped up substantially with judicial use of PlatformSpeed.

More information about JSmol:

  • Jmol JavaScript Object: A full discussion of what JSmol is and how it can be implemented on a web page. Technical information about the libraries used to implement both the Java and HTML5 modes and to interact with them via scripts and user interface controls such as buttons, links, and menus.
Maybe you want to go straight to
  • JSmol pros and cons describes the problems JSmol has with large models and certain web browsers.


Installing Jmol / JSmol
Running Jmol / JSmol
Jmol / JSmol Tutorials
Jmol + JSmol Documentation

Contributors

AngelHerraez, EricMartz, Hansonr

Retrieved from "https://wiki.jmol.org/index.php?title=JSmol&oldid=9028"