What Is JSME JavaScript API

Q

What is JSME JavaScript API? I want to see an example on how to use it.

✍: FYIcenter.com

A

JSME JavaScript API is programming interface provided by JSME for your JavaScript code to interact with the JSME editor.

JSME JavaScript API offers the following primary methods under the "JSApplet.JSME" class, which is provided in the ./jsme/jsme.nocache.js file.

  • jsmeObj = new JSApplet.JSME(htmlId) - Creates a new instance of JSME editor inside the HTML element identified by the "htmlId". Note that naming your JSME instance as "jsme" will cause JavaScript loading error. So name it like "jsmeObj".
  • jsmeObj.clear() - Removes contents inside the editor.
  • jsmeObj.getMolecularAreaGraphicsString() - Returns SVG representation of the molecule in the editor.
  • jsmeObj.getParentContainer() - Returns the HTML element that contains the editor.
  • jsmeObj.molFile() - Returns the molecule in the editor in Mol/SDF format.
  • jsmeObj.options() - Sets editor's options.
  • jsmeObj.readGenericMolecularInput() - Reads a molecule in any one of the supported formats: Mol/SDF, SMILES, JME.
  • jsmeObj.readMolFile() - Reads a molecule in Mol/SDF format from the given string into the editor.
  • jsmeObj.setSize() - Sets the size of the editor windows.
  • jsmeObj.setMolecularAreaLineWidth() - Sets the line width for bonds displayed in the editor.
  • jsmeObj.setMolecularAreaScale() - Sets molecule display scale in the editor.
  • jsmeObj.smiles() - Returns molecule's SMILES string from the editor.

The following HTML document example, api-smiles.html, shows you how to JSME JavaScript API methods:

<html>
<head>
<title>API - Show SMILES</title>
<!-- loading JSME JavaScript library -->
<script type="text/javascript" src="/jsme/jsme.nocache.js"></script>
<script>
  // running JSME in the "div" tag identified as "jsme_container"
  function jsmeOnLoad() {
    jsmeObj = new JSApplet.JSME("jsme_container", "380px", "340px");
  }
</script>
</head>
<body>
<p>Hello, please try the JSME molecule editor below:</p>
<div id="jsme_container"></div>
<button type="button" onclick="alert(jsmeObj.smiles())">Show SMILES</button>
</body>
</html>

JSME also provides another class, JSApplet.Inchi, in the jsme/96E40B969193BD74B8A621486920E79C.cache.js file to compute InChI and InChIKey from a given SDF file using the JSApplet.Inchi.computeInchi() method.

For the complete list of JSME API method, open "./JSME_nnnn-nn-nn/api_javadoc/index.html" in a Web browser to read.

 

JSApplet.Inchi.computeInchi() - Generate InChI

JSME JavaScript API

JSME JavaScript API

⇑⇑ JSME Tutorials

2020-05-18, 1729👍, 0💬