Global

Members

(readonly) CAP

Enum for cylinder cap styles.

Properties

Name	Type	Description
`NONE`
`FLAT`
`ROUND`

Source: GLDraw.ts

(constant) OFFSETS

Source: parsers/utils/assignBonds.ts

(readonly) SurfaceType :number

Surface types

Type:

number

Properties

Name	Type	Description
`VDW`		van der Waals surface
`MS`		Molecular surface
`SAS`		Solvent accessible surface
`SES`		Solvent exposed surface

Source: ProteinSurface4.ts

(constant) builtinColorSchemes

built in color schemes
The user can pass these strings directly as the colorscheme

Properties

Name	Type	Description
`ssPyMol`		pymol secondary structure
`ssJmol`		jmol secondary structure
`Jmol`		jmol element defaults
`amino`		amino acid coloring
`shapely`		amino acid coloring
`nucleic`		nucleic acid coloring
`chain`		color by chain
`rasmol`		rasmol default element coloring
`default`		default element coloring
`greenCarbon`		default element coloring with green carbon
`cyanCarbon`		default element coloring with cyan carbon
`magentaCarbon`		default element coloring with magenta carbon
`purpleCarbon`		default element coloring with purple carbon
`whiteCarbon`		default element coloring with white carbon
`orangeCarbon`		default element coloring with orange carbon
`yellowCarbon`		default element coloring with yellow carbon
`blueCarbon`		default element coloring with blue carbon
`chainHetatm`		color chains

Source: colors.ts

Example

window.$3Dmol.download("pdb:4UAA",viewer,{},function(){
   viewer.setBackgroundColor(0xffffffff);
   var colorAsSnake = function(atom) {
     return atom.resi % 2 ? 'white': 'green'
   };
   viewer.setStyle( {chain:'A'}, { cartoon: {colorfunc: colorAsSnake }});
   viewer.setStyle( {chain:'B'}, { stick: {colorscheme: 'yellowCarbon'}});
   viewer.render();
 });

(constant) elementColors

Preset element coloring - from individual element colors to entire mappings (e.g. 'elementColors.Jmol' colors atoms with Jmol stylings)

Source: colors.ts

(constant) ssColors

Preset secondary structure color scheme

Source: colors.ts

syncSurface :boolean

Render surface synchronously if true

Type:

boolean

Source: ProteinSurface4.ts

viewers

Contains a dictionary of embedded viewers created from HTML elements
with a the viewer_3Dmoljs css class indexed by their id (or numerically
if they do not have an id).

Source: autoload.ts

Methods

CDJSON(str, options)

This parses the ChemDoodle json file format. Although this is registered
for the json file extension, other chemical json file formats exist that
this can not parse. Check which one you have and do not assume that
.json can be parsed

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/CDJSON.ts

CIF(str, options)

Puts atoms specified in mmCIF fromat in str into atoms

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/CIF.ts

CUBE(str, options)

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/CUBE.ts

GRO(str, options*)

Parse a gro file from str and create atoms

Parameters:

Name	Type	Description
`str`	string
`options*`	ParserOptionsSpec

Source: parsers/GRO.ts

LAMMPSTRJ()

Parse a lammps trajectory file from str and create atoms

Source: parsers/LAMMPSTRJ.ts

MMTFparser(bindata, ParserOptionsSpec)

Parameters:

Name	Type	Description
`bindata`		binary UInt8Array buffer or a base64 encoded string
`ParserOptionsSpec`

Source: parsers/MMTF.ts

MOL2(str, options)

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/MOL2.ts

PDB(str, options)

Parse pdb file from str and create atoms if computeStruct is true will always perform secondary structure analysis,
otherwise only do analysis of SHEET/HELIX comments are missing

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec	keepH (do not strip hydrogens), noSecondaryStructure, assignbonds (default true, calculate implicit bonds) (do not compute ss), altLoc (which alternate location to select, if present; '*' to load all)

Source: parsers/PDB.ts

PQR(str, options)

Parse a pqr file from str and create atoms. A pqr file is assumed to be a whitespace delimited PDB with charge and radius fields.

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec	noSecondaryStructure (do not compute ss)

Source: parsers/PQR.ts

PRMTOP(str, options)

Parse a prmtop file from str and create atoms

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec	noSecondaryStructure (do not compute ss)

Source: parsers/PRMTOP.ts

SDF(str, options)

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/SDF.ts

VASP(str, options)

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/VASP.ts

XYZ(str, options)

Read an XYZ file from str and return result

Parameters:

Name	Type	Description
`str`	string
`options`	ParserOptionsSpec

Source: parsers/XYZ.ts

assignPDBBonds(atomsarray)

Parameters:

Name	Type	Description
`atomsarray`	Array.<AtomSpec>

Source: parsers/utils/assignPDBBonds.ts

conversionMatrix3(a, b, c, alpha, beta, gamma) → {Matrix3}

Parameters:

Name	Type	Description
`a`	number
`b`	number
`c`	number
`alpha`	number
`beta`	number
`gamma`	number

Source: WebGL/math/utils/conversionMatrix3.ts

Returns:

Type:: Matrix3

createViewer(element, configopt) → {GLViewer}

Create and initialize an appropriate viewer at supplied HTML element using specification in config

Parameters:

Name	Type	Attributes	Description
`element`	Object \| string		Either HTML element or string identifier
`config`	ViewerSpec	<optional>	Viewer configuration

Source: GLViewer.ts

Returns:

GLViewer, null if unable to instantiate WebGL

Type:: GLViewer

Example

var viewer = $3Dmol.createViewer(
     'gldiv', //id of div to create canvas in
     {
       defaultcolors: $3Dmol.elementColors.rasmol,
       backgroundColor: 'black'
     }
   );

createViewerGrid(element, configopt, viewer_configopt)

Create and initialize an appropriate a grid of viewers that share a WebGL canvas

Parameters:

Name	Type	Attributes	Description
`element`	Object \| string		Either HTML element or string identifier
`config`	GridSpec	<optional>	grid configuration
`viewer_config`	ViewerGridSpec	<optional>	Viewer specification to apply to all subviewers

Source: GLViewer.ts

Returns:

[[GLViewer]] 2D array of GLViewers

Example

var viewers = $3Dmol.createViewerGrid(
     'gldiv', //id of div to create canvas in
     {
       rows: 2,
       cols: 2,
       control_all: true  //mouse controls all viewers
     },
     { backgroundColor: 'lightgrey' }
   );
   $3Dmol.get('data/1jpy.cif', function(data) {
     var viewer = viewers[0][0];
     viewer.addModel(data,'cif');
     viewer.setStyle({sphere:{}});
     viewer.zoomTo();
     viewer.render( );

     viewer = viewers[0][1];
     viewer.addModel(data,'cif');
     viewer.setStyle({stick:{}});
     viewer.zoomTo();
     viewer.render( );

     viewer = viewers[1][0];
     viewer.addModel(data,'cif');
     viewer.setStyle({cartoon:{color:'spectrum'}});
     viewer.zoomTo();
     viewer.render( );

     viewer = viewers[1][1];
     viewer.addModel(data,'cif');
     viewer.setStyle({cartoon:{colorscheme:'chain'}});
     viewer.zoomTo();
     viewer.render();


   });

download(query, viewer, options, callbackopt) → {GLModel}

Load a PDB/PubChem structure into existing viewer. Automatically calls 'zoomTo' and 'render' on viewer after loading model

Parameters:

Name	Type	Attributes	Description
`query`	string		String specifying pdb or pubchem id; must be prefaced with "pdb: " or "cid: ", respectively
`viewer`	GLViewer		Add new model to existing viewer
`options`	Object		Specify additional options format: file format to download, if multiple are available, default format is pdb pdbUri: URI to retrieve PDB files, default URI is http://www.rcsb.org/pdb/files/
`callback`	function	<optional>	Function to call with model as argument after data is loaded.

Source: utilities.ts

Returns:

GLModel, Promise if callback is not provided

Type:: GLModel

Example

viewer.setBackgroundColor(0xffffffff);
       $3Dmol.download('pdb:2nbd',viewer,{onemol: true,multimodel: true},function(m) {
        m.setStyle({'cartoon':{colorscheme:{prop:'ss',map:$3Dmol.ssColors.Jmol}}});
       viewer.zoomTo();
       viewer.render(callback);
    });

get(uri, callback)

Fetch data from URL

Parameters:

Name	Type	Description
`uri`		URL
`callback`		Function to call with data

Source: utilities.ts

getbin(uri, callbackopt, requestopt, postdataopt) → {Promise}

Download binary data (e.g. a gzipped file) into an array buffer and provide
arraybuffer to callback.

Parameters:

Name	Type	Attributes	Description
`uri`	string		location of data
`callback`	function	<optional>	Function to call with arraybuffer as argument.
`request`	string	<optional>	type of request
`postdata`	string	<optional>	data for POST request

Source: utilities.ts

Returns:

Type:: Promise

parseV3000(linesnon-null, options) → (non-null) {Array.<!Array.<!Object>>}

Parameters:

Name	Type	Description
`lines`	Array.<string>
`options`	ParserOptionsSpec

Source: parsers/SDF.ts

Returns:

Type:: Array.<!Array.<!Object>>

setSyncSurface(val)

Parameters:

Name	Type	Description
`val`	boolean	Whether surfaces should be rendered synchronously or in parallel.

Source: ProteinSurface4.ts

Type Definitions

ColorSpec

Color representation. A hex number, html color name, or object with r/g/b properties

Type:

number | string | Colored

Source: colors.ts

ColorschemeSpec

Colorscheme specification.

Type:

string | object

Properties

Name	Type	Attributes	Description
`gradient`	GradientType \| string	<optional>
`min`	number	<optional>
`max`	number	<optional>
`prop`	string	<optional>	{AtomSpec} property to use for gradient calculation. E.g., 'b' for temperature factors of a PDB.
`mid`	number	<optional>	mid point value for gradient (for rwb)
`colors`	Array.<ColorSpec>	<optional>	Custom colors for gradient (for `CustomLinear`)
`map`	Record.<string, unknown>	<optional>	map of a certain `AtomSpec` property to a color of the form `{'prop': 'elem', map:elementColors.greenCarbon}` Allows the user to provide a mapping of elements to colors to the colorscheme. This can be done with any properties, and not just 'elem'.

Source: colors.ts
See: builtinColorSchemes