JSmol

Wrapper for the chemical structure viewer based on <JSmol at url target=”http://wiki.jmol.org/index.php/Jmol_JavaScript_Object” name=”http://wiki.jmol.org/index.php/Jmol_JavaScript_Object” ​/> HTML5.  This currently implements the lite version of JSmol

Simple demo application available here.

Summary
JSmolWrapper for the chemical structure viewer based on <JSmol at url target=”http://wiki.jmol.org/index.php/Jmol_JavaScript_Object” name=”http://wiki.jmol.org/index.php/Jmol_JavaScript_Object” ​/> HTML5.
Functions
jsmolConvert DIV panel into JSmol viewer.
Types
Options
Functions
setCSID
setSMILES
setMOLShow molecule with this mol.
toggleSpinIf JSMol spin is on then it sets it to off, and vice-versa
setOptionsSet new options to update the widget’s view

Functions

jsmol

Convert DIV panel into JSmol viewer.

Parameters

optionsInitialization Options
$('#jsmolcontainer').jsmol({
    width: 300,
    height: 300,
    csid: 236,
    color: "0xC0C0C0",
    bondWidth: 4,
    zoomScaling: 1.5,
    pinchScaling: 2.0,
    multipleBondSpacing: 2,
    spinRateX: 0.2,
    spinRateY: 0.5,
    spinFPS: 20,
    spin:true
});

Types

Options

Properties

widthWidth of the widget in pixels.  Default value - 300
heightHeight of the widget in pixels.  Default value - 300
csidChemSpider ID to be displayed
smilesSMILES string of the molecule that should be displayed
molstring containing contents of mol connection file of the molecule to be displayed (with each new line delimited by \n) e.g. mol:”” +”\n” +”\n” +”\n 2 1 0 0000 0 0 0 0 0999 V2000” +”\n 2.4000 -0.4625 0.0000 C 0 0 0 0 0 0 0 0 0 0 0” +”\n 3.7167 -0.4667 0.0000 C 0 0 0 0 0 0 0 0 0 0 0” +”\n 2 1 2 0” +”\nM END” +”\n” +”\n$$$$\n”
colorset background color of JSmol.  Can be specified as decimal [red,green,blue] or hexadecimal [xRRGGBB] triplets - see http://jmol.sourceforge.net/jscolors/ for more details
bondWidthset bond width of JSmol
zoomScalingset zoom scaling factor of JSmol
pinchScalingset pinch scaling factor of JSmol
multipleBondSpacingset multiple Bond Spacing of JSmol
spinRateXset spin Rate of molecule in JSmol in x direction (if spin is set to true)
spinRateYset spin Rate of molecule in JSmol in y direction (if spin is set to true)
spinFPSset spin frames per second of molecule in JSmol (if spin is set to true)
spinset to true to make molecule spin when displayed, or false if not

Functions

setCSID

setCSID: function (csid)
Show molecule with this ChemSpider IDretrieves mol from ChemSpider webservice.

Parameters

csidChemSpider ID
jsmol.setCSID(10368587);

setSMILES

setSMILES: function (smiles)
Show molecule that has this smilesconverts smiles to mol using ChemSpider webservice.

Parameters

smilesSMILES string
jsmol.setSMILES('CC(=O)Oc1ccccc1C(=O)O');

setMOL

setMOL: function (mol)

Show molecule with this mol.

Parameters

molcontents of mol connection file defining structure
jsmol.setMOL(""
                +"\n"
                +"\n"
                +"\n  2  1  0  0000  0  0  0  0  0999 V2000"
                +"\n    2.4000   -0.4625    0.0000 C   0  0  0  0  0  0  0  0  0  0  0"
                +"\n    3.7167   -0.4667    0.0000 C   0  0  0  0  0  0  0  0  0  0  0"
                +"\n  2  1  2  0"
                +"\nM  END"
                +"\n"
                +"\n$$$$\n");

toggleSpin

toggleSpin: function ()

If JSMol spin is on then it sets it to off, and vice-versa

jsmol.toggleSpin();

setOptions

setOptions: function (options)

Set new options to update the widget’s view

jsmol.setOptions({
    bondWidth: 2,
    spinRateX: 0.1,
    spinRateY: 0.1
});
setCSID: function (csid)
setSMILES: function (smiles)
setMOL: function (mol)
Show molecule with this mol.
toggleSpin: function ()
If JSMol spin is on then it sets it to off, and vice-versa
setOptions: function (options)
Set new options to update the widget’s view