Marvin4JS API Reference

Table of Contents

Static functions

Methods Return Value Description
marvin.Sketch.isSupported()
boolean

Returns true if HTML5 canvas is supported, false otherwise.

Returns: true if HTML5 canvas is supported, false otherwise.

marvin.ImageExporter.molToDataUrl(String source, String imageType, JavaScriptObject optionalSettings)
String

Creates image data stream from the given molecule source.

Parameters:

  • source - molecule source in MDL molfile
  • imageType - output image data stream MIME type (default value is "image/png").
  • optionalSettings - JS wrapped JSO object that describes display settings. The JSO object contains key - value pairs.

    KeyTypeValuesDefault valueNotes
    "carbonLabelVisible"Boolean{true, false}false-
    "chiralFlagVisible"Boolean{true, false}true-
    "atomIndicesVisible"Boolean{true, false}false-
    "cpkColoring"Boolean{true, false}true-
    "implicitHydrogen"String{"ALL", "OFF", "HETERO", "TERMINAL_AND_HETERO"}"TERMINAL_AND_HETERO"If "carbonLabelVisible" value is true, "HETERO" and "TERMINAL_AND_HETERO" values will be considered as "ALL".
    "background-color"Stringcss color-do not set this to leave it transparent (png) or white
    "width"Numberpositive integer200-
    "height"Numberpositive integer200-

    E.g.: 
     {
 'carbonLabelVisible' : false,
 'chiralFlagVisible' : true,
 'implicitHydrogen' : "OFF",
 'background-color' : "#ff00ff",
 'width' : 300,
 'height' : 350
 }

Returns: image stream encoded as an image data URL if image width/height is greater than zero

marvin.ImageExporter.mrvToDataUrl(String source, String imageType, JavaScriptObject optionalSettings)
String

Creates image data stream from the given molecule source.

Parameters:

  • source - molecule source in MRV
  • imagType - output image data stream MIME type (default value is "image/png").
  • optionalSettings - JS wrapped JSO object that describes display settings. The JSO object contains key - value pairs.

    KeyTypeValuesDefault valueNotes
    "carbonLabelVisible"Boolean{true, false}false-
    "chiralFlagVisible"Boolean{true, false}true-
    "atomIndicesVisible"Boolean{true, false}false-
    "cpkColoring"Boolean{true, false}true-
    "implicitHydrogen"String{"ALL", "OFF", "HETERO", "TERMINAL_AND_HETERO"}"TERMINAL_AND_HETERO"If "carbonLabelVisible" value is true, "HETERO" and "TERMINAL_AND_HETERO" values will be considered as "ALL".
    "background-color"Stringcss color-do not set this to leave it transparent (png) or white
    "width"Numberpositive integer200-
    "height"Numberpositive integer200-

    * E.g.: 
     {
 'carbonLabelVisible' : false,
 'chiralFlagVisible' : true,
 'implicitHydrogen' : "OFF",
 'background-color' : "#ff00ff",
 'width' : 300,
 'height' : 350
 }

Returns: image stream encoded as an image data URL if image width/height is greater than zero

Classes

marvin.Sketch

Constructors Description
marvin.Sketch()

Creates a new editor widget and inserts it into the body of the current page.

marvin.Sketch(String id)

Creates a new editor widget and inserts it into the specified DOM element.

Parameters:

  • id - the ID of the DOM element whose child will be the editor widget.
Methods Return Value Description
getDisplaySettings()
JavaScriptObject

Retrieves the current display settings of the editor wrapped into a JSON object.

Returns: map of display setting is wrapped into a JSON object.

KeyTypeValuesDefault valueNotes
"carbonLabelVisible"Boolean{true, false}false-
"chiralFlagVisible"Boolean{true, false}true-
"atomIndicesVisible"Boolean{true, false}false-
"cpkColoring"Boolean{true, false}true-
"implicitHydrogen"String{"ALL", "OFF", "HETERO", "TERMINAL_AND_HETERO"}"TERMINAL_AND_HETERO"If "carbonLabelVisible" value is true, "HETERO" and "TERMINAL_AND_HETERO" values will be considered as "ALL".

E.g.: 

 {
  "carbonLabelVisible" : false,
	"chiralFlagVisible"	 : true,
  "atomIndicesVisible" : false,
  "chiralFlagVisible"  : true,
  "cpkColoring" : true,
  "implicitHydrogen" : "TERMINAL_AND_HETERO"
 }

setDisplaySettings(JavaScriptObject jso)
 

Applies a map of display settings for the editor. Check the return value of the getDisplaySettings() function to look up the full display settings map.

Parameters:

  • jso - map of display setting is wrapped into a JSON object.

    KeyTypeValuesDefault valueNotes
    "carbonLabelVisible"Boolean{true, false}false-
    "chiralFlagVisible"Boolean{true, false}true-
    "atomIndicesVisible"Boolean{true, false}false-
    "cpkColoring"Boolean{true, false}true-
    "implicitHydrogen"String{"ALL", "OFF", "HETERO", "TERMINAL_AND_HETERO"}"TERMINAL_AND_HETERO"If "carbonLabelVisible" value is true, "HETERO" and "TERMINAL_AND_HETERO" values will be considered as "ALL".

    E.g.: 
     {
  "carbonLabelVisible" : false,
	"chiralFlagVisible"	 : true,
  "atomIndicesVisible" : false,
  "chiralFlagVisible"  : true,
  "cpkColoring" : true,
  "implicitHydrogen" : "TERMINAL_AND_HETERO"
 }

importAsMol(String mol)
 

Updates the canvas content with given molecule.

Parameters:

  • mol - the molecule in MDL molfile format.
importAsMrv(String mol)
 

Updates the canvas content with given molecule.

Parameters:

  • mol - the molecule in MRV format.
exportAsMol()
String

Exports the canvas content into MDL molfile format.

Returns: molecule source in MDL molfile format or null (if MDL molfile export was unsuccessful).

exportAsMrv()
String

Exports the canvas content into MRV format.

Returns: molecule source in MRV format or null (if MRV export was unsuccessful).

pasteAsMol(String mol)
 

Inserts the given molecule to the canvas.

Parameters:

  • mol - the molecule in MDL molfile format.
pasteAsMrv(String mol)
 

Inserts the given molecule to the canvas.

Parameters:

  • mol - the molecule in MRV format.
setServices(JavaScriptObject jso)
 

Sets up services for the editor. See the webservices.js for the list of supported services.

Parameters:

  • jso - map of services wrapped into a JSON object 
     {
 'clean2dws' : <url of Clean2D webservice>
 'molconvertws' : <url of MolConvert webservice>
 }

addButton(JavaScriptObject jso, function() {})
 

Appends a new button to the specified toolbar and binds its onClick event with the given function.

Parameters:

  • jso - attributes of button is wrapped into a JSON object. E.g.: 
     {
  'name': "customButton", // JS String
  'image-url': "images/custom-button.png" // JS String
  'toolbar': "W" // JS String: "W" as West, "E" as East, "N" as North, "S" as South toolbar
 }

getSelection()
JavaScriptObject

Returns the indexes of the selected atoms and bonds. Atoms are indexed from 1.

Returns: JSON object with indeces of selected atoms and bonds. E.g.: 

 {
   'atoms' : "1,2,3",
   'bonds' : "1-2,2-3"
 }

setSelection(JavaScriptObject jso)
 

Selects bonds and atoms of the specified indices (assuming the indices start from 1). Bonds are identified by their atoms' indices (separate indeces with '-').

Parameters:

  • JSON - object that describes atoms and bonds to select. E.g.: 
     {
   'atoms' : "1,2,3",
   'bonds' : "1-2,2-3"
 }

onMolChange(function() {})
 

Adds a MolChange event listener to the editor.

Parameters:

  • callback - this function is invoked when the molecule is changed on the canvas.