3dmol
Version:
JavaScript/TypeScript molecular visualization library
37 lines (34 loc) • 78 kB
HTML
<!DOCTYPE html><html lang="en" style="font-size:16px"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="Author" content="David Koes & 3Dmoljs Contributors"><meta name="Description" content="A modern, object-oriented JavaScript library for visualizing molecular data"><title>Class: GLModel</title><!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--><script src="scripts/third-party/hljs.js" defer="defer"></script><script src="scripts/third-party/hljs-line-num.js" defer="defer"></script><script src="scripts/third-party/popper.js" defer="defer"></script><script src="scripts/third-party/tippy.js" defer="defer"></script><script src="scripts/third-party/tocbot.min.js"></script><script>var baseURL="/",locationPathname="";baseURL=(locationPathname=document.location.pathname).substr(0,locationPathname.lastIndexOf("/")+1)</script><link rel="stylesheet" href="styles/clean-jsdoc-theme.min.css"><style>article ul li{list-style:disc}</style><svg aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:none"><defs><symbol id="copy-icon" viewbox="0 0 488.3 488.3"><g><path d="M314.25,85.4h-227c-21.3,0-38.6,17.3-38.6,38.6v325.7c0,21.3,17.3,38.6,38.6,38.6h227c21.3,0,38.6-17.3,38.6-38.6V124 C352.75,102.7,335.45,85.4,314.25,85.4z M325.75,449.6c0,6.4-5.2,11.6-11.6,11.6h-227c-6.4,0-11.6-5.2-11.6-11.6V124 c0-6.4,5.2-11.6,11.6-11.6h227c6.4,0,11.6,5.2,11.6,11.6V449.6z"/><path d="M401.05,0h-227c-21.3,0-38.6,17.3-38.6,38.6c0,7.5,6,13.5,13.5,13.5s13.5-6,13.5-13.5c0-6.4,5.2-11.6,11.6-11.6h227 c6.4,0,11.6,5.2,11.6,11.6v325.7c0,6.4-5.2,11.6-11.6,11.6c-7.5,0-13.5,6-13.5,13.5s6,13.5,13.5,13.5c21.3,0,38.6-17.3,38.6-38.6 V38.6C439.65,17.3,422.35,0,401.05,0z"/></g></symbol><symbol id="search-icon" viewBox="0 0 512 512"><g><g><path d="M225.474,0C101.151,0,0,101.151,0,225.474c0,124.33,101.151,225.474,225.474,225.474 c124.33,0,225.474-101.144,225.474-225.474C450.948,101.151,349.804,0,225.474,0z M225.474,409.323 c-101.373,0-183.848-82.475-183.848-183.848S124.101,41.626,225.474,41.626s183.848,82.475,183.848,183.848 S326.847,409.323,225.474,409.323z"/></g></g><g><g><path d="M505.902,476.472L386.574,357.144c-8.131-8.131-21.299-8.131-29.43,0c-8.131,8.124-8.131,21.306,0,29.43l119.328,119.328 c4.065,4.065,9.387,6.098,14.715,6.098c5.321,0,10.649-2.033,14.715-6.098C514.033,497.778,514.033,484.596,505.902,476.472z"/></g></g></symbol><symbol id="font-size-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.246 15H4.754l-2 5H.6L7 4h2l6.4 16h-2.154l-2-5zm-.8-2L8 6.885 5.554 13h4.892zM21 12.535V12h2v8h-2v-.535a4 4 0 1 1 0-6.93zM19 18a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"/></symbol><symbol id="add-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z"/></symbol><symbol id="minus-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5 11h14v2H5z"/></symbol><symbol id="dark-theme-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M10 7a7 7 0 0 0 12 4.9v.1c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2h.1A6.979 6.979 0 0 0 10 7zm-6 5a8 8 0 0 0 15.062 3.762A9 9 0 0 1 8.238 4.938 7.999 7.999 0 0 0 4 12z"/></symbol><symbol id="light-theme-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12zm0-2a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM11 1h2v3h-2V1zm0 19h2v3h-2v-3zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05 3.515 4.93zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414-2.121-2.121zm2.121-14.85l1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414 2.121-2.121zM23 11v2h-3v-2h3zM4 11v2H1v-2h3z"/></symbol><symbol id="reset-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18.537 19.567A9.961 9.961 0 0 1 12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10c0 2.136-.67 4.116-1.81 5.74L17 12h3a8 8 0 1 0-2.46 5.772l.997 1.795z"/></symbol><symbol id="down-icon" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.7803 6.21967C13.0732 6.51256 13.0732 6.98744 12.7803 7.28033L8.53033 11.5303C8.23744 11.8232 7.76256 11.8232 7.46967 11.5303L3.21967 7.28033C2.92678 6.98744 2.92678 6.51256 3.21967 6.21967C3.51256 5.92678 3.98744 5.92678 4.28033 6.21967L8 9.93934L11.7197 6.21967C12.0126 5.92678 12.4874 5.92678 12.7803 6.21967Z"></path></symbol><symbol id="codepen-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M16.5 13.202L13 15.535v3.596L19.197 15 16.5 13.202zM14.697 12L12 10.202 9.303 12 12 13.798 14.697 12zM20 10.869L18.303 12 20 13.131V10.87zM19.197 9L13 4.869v3.596l3.5 2.333L19.197 9zM7.5 10.798L11 8.465V4.869L4.803 9 7.5 10.798zM4.803 15L11 19.131v-3.596l-3.5-2.333L4.803 15zM4 13.131L5.697 12 4 10.869v2.262zM2 9a1 1 0 0 1 .445-.832l9-6a1 1 0 0 1 1.11 0l9 6A1 1 0 0 1 22 9v6a1 1 0 0 1-.445.832l-9 6a1 1 0 0 1-1.11 0l-9-6A1 1 0 0 1 2 15V9z"/></symbol><symbol id="close-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z"/></symbol><symbol id="menu-icon" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M3 4h18v2H3V4zm0 7h18v2H3v-2zm0 7h18v2H3v-2z"/></symbol></defs></svg></head><body data-theme="light"><div class="sidebar-container"><div class="sidebar" id="sidebar"><a href="/" class="sidebar-title sidebar-title-anchor">3Dmol.js</a><div class="sidebar-items-container"><div class="sidebar-section-title with-arrow" data-isopen="false" id="mei5HJjYKLn6aua5Z5PM5"><div>Classes</div><svg><use xlink:href="#down-icon"></use></svg></div><div class="sidebar-section-children-container"><div class="sidebar-section-children"><a href="$3Dmol.Label.html">Label</a></div><div class="sidebar-section-children"><a href="$3Dmol.StateManager.html">StateManager</a></div><div class="sidebar-section-children"><a href="$3Dmol.UI.html">UI</a></div><div class="sidebar-section-children"><a href="Color.html">Color</a></div><div class="sidebar-section-children"><a href="CustomLinear.html">CustomLinear</a></div><div class="sidebar-section-children"><a href="Cylinder.html">Cylinder</a></div><div class="sidebar-section-children"><a href="GLModel.html">GLModel</a></div><div class="sidebar-section-children"><a href="GLShape.html">GLShape</a></div><div class="sidebar-section-children"><a href="GLShape_GLShape.html">GLShape</a></div><div class="sidebar-section-children"><a href="GLViewer.html">GLViewer</a></div><div class="sidebar-section-children"><a href="GLVolumetricRender.html">GLVolumetricRender</a></div><div class="sidebar-section-children"><a href="Matrix3.html">Matrix3</a></div><div class="sidebar-section-children"><a href="Matrix4.html">Matrix4</a></div><div class="sidebar-section-children"><a href="Quaternion.html">Quaternion</a></div><div class="sidebar-section-children"><a href="ROYGB.html">ROYGB</a></div><div class="sidebar-section-children"><a href="RWB.html">RWB</a></div><div class="sidebar-section-children"><a href="Ray.html">Ray</a></div><div class="sidebar-section-children"><a href="Sinebow.html">Sinebow</a></div><div class="sidebar-section-children"><a href="Sphere.html">Sphere</a></div><div class="sidebar-section-children"><a href="Surface.html">Surface</a></div><div class="sidebar-section-children"><a href="Triangle.html">Triangle</a></div><div class="sidebar-section-children"><a href="Vector2.html">Vector2</a></div><div class="sidebar-section-children"><a href="Vector3.html">Vector3</a></div><div class="sidebar-section-children"><a href="VolumeData.html">VolumeData</a></div></div><div class="sidebar-section-title with-arrow" data-isopen="false" id="kv4Yx5z0THf_b8XR4Gje1"><div>Namespaces</div><svg><use xlink:href="#down-icon"></use></svg></div><div class="sidebar-section-children-container"><div class="sidebar-section-children"><a href="GLDraw.html">GLDraw</a></div></div><div class="sidebar-section-title with-arrow" data-isopen="false" id="ykThSufQWJcKGT1kXzr-A"><div>Tutorials</div><svg><use xlink:href="#down-icon"></use></svg></div><div class="sidebar-section-children-container"><div class="sidebar-section-children"><a href="tutorial-code.html">Using 3Dmol within your code</a></div><div class="sidebar-section-children"><a href="tutorial-embeddable.html">Embedding a 3Dmol Viewer</a></div><div class="sidebar-section-children"><a href="tutorial-home.html">3Dmol Tutorials - Home</a></div><div class="sidebar-section-children"><a href="tutorial-learning_environment.html">Active Learning with 3Dmol.js</a></div><div class="sidebar-section-children"><a href="tutorial-url.html">Viewing Molecules with the 3Dmol Server</a></div></div><div class="sidebar-section-title with-arrow" data-isopen="false" id="XcP4RUEg6tp7YKHbBVi9E"><div>Interfaces</div><svg><use xlink:href="#down-icon"></use></svg></div><div class="sidebar-section-children-container"><div class="sidebar-section-children"><a href="AmbientOcclusionStyle.html">AmbientOcclusionStyle</a></div><div class="sidebar-section-children"><a href="ArrowSpec.html">ArrowSpec</a></div><div class="sidebar-section-children"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></div><div class="sidebar-section-children"><a href="AtomSpec.html">AtomSpec</a></div><div class="sidebar-section-children"><a href="AtomStyleSpec.html">AtomStyleSpec</a></div><div class="sidebar-section-children"><a href="BondStyle.html">BondStyle</a></div><div class="sidebar-section-children"><a href="BoxSpec.html">BoxSpec</a></div><div class="sidebar-section-children"><a href="CartoonStyleSpec.html">CartoonStyleSpec</a></div><div class="sidebar-section-children"><a href="ClickSphereStyleSpec.html">ClickSphereStyleSpec</a></div><div class="sidebar-section-children"><a href="CrossStyleSpec.html">CrossStyleSpec</a></div><div class="sidebar-section-children"><a href="CurveSpec.html">CurveSpec</a></div><div class="sidebar-section-children"><a href="CustomShapeSpec.html">CustomShapeSpec</a></div><div class="sidebar-section-children"><a href="CylinderSpec.html">CylinderSpec</a></div><div class="sidebar-section-children"><a href="DashedBondSpec.html">DashedBondSpec</a></div><div class="sidebar-section-children"><a href="FogSpec.html">FogSpec</a></div><div class="sidebar-section-children"><a href="IsoSurfaceSpec.html">IsoSurfaceSpec</a></div><div class="sidebar-section-children"><a href="LabelSpec.html">LabelSpec</a></div><div class="sidebar-section-children"><a href="LineSpec.html">LineSpec</a></div><div class="sidebar-section-children"><a href="LineStyleSpec.html">LineStyleSpec</a></div><div class="sidebar-section-children"><a href="OutlineStyle.html">OutlineStyle</a></div><div class="sidebar-section-children"><a href="ParserOptionsSpec.html">ParserOptionsSpec</a></div><div class="sidebar-section-children"><a href="ShapeSpec.html">ShapeSpec</a></div><div class="sidebar-section-children"><a href="SphereSpec.html">SphereSpec</a></div><div class="sidebar-section-children"><a href="SphereStyleSpec.html">SphereStyleSpec</a></div><div class="sidebar-section-children"><a href="StickStyleSpec.html">StickStyleSpec</a></div><div class="sidebar-section-children"><a href="SurfaceStyleSpec.html">SurfaceStyleSpec</a></div><div class="sidebar-section-children"><a href="UnitCellStyleSpec.html">UnitCellStyleSpec</a></div><div class="sidebar-section-children"><a href="ViewStyle.html">ViewStyle</a></div><div class="sidebar-section-children"><a href="ViewerGridSpec.html">ViewerGridSpec</a></div><div class="sidebar-section-children"><a href="ViewerSpec.html">ViewerSpec</a></div><div class="sidebar-section-children"><a href="VolumetricRendererSpec.html">VolumetricRendererSpec</a></div><div class="sidebar-section-children"><a href="WithinSelectionSpec.html">WithinSelectionSpec</a></div><div class="sidebar-section-children"><a href="global.html#XYZ">XYZ</a></div></div><div class="sidebar-section-title with-arrow" data-isopen="false" id="jmKnIXRJjdjZ366ci7cdd"><div>Global</div><svg><use xlink:href="#down-icon"></use></svg></div><div class="sidebar-section-children-container"><div class="sidebar-section-children"><a href="global.html#BCIF">BCIF</a></div><div class="sidebar-section-children"><a href="global.html#CAP">CAP</a></div><div class="sidebar-section-children"><a href="global.html#CDJSON">CDJSON</a></div><div class="sidebar-section-children"><a href="global.html#CIF">CIF</a></div><div class="sidebar-section-children"><a href="global.html#CUBE">CUBE</a></div><div class="sidebar-section-children"><a href="global.html#ColorSpec">ColorSpec</a></div><div class="sidebar-section-children"><a href="global.html#ColorschemeSpec">ColorschemeSpec</a></div><div class="sidebar-section-children"><a href="global.html#GRO">GRO</a></div><div class="sidebar-section-children"><a href="global.html#GradientSpec">GradientSpec</a></div><div class="sidebar-section-children"><a href="global.html#MMTFparser">MMTFparser</a></div><div class="sidebar-section-children"><a href="global.html#MOL2">MOL2</a></div><div class="sidebar-section-children"><a href="global.html#OFFSETS">OFFSETS</a></div><div class="sidebar-section-children"><a href="global.html#PDB">PDB</a></div><div class="sidebar-section-children"><a href="global.html#PQR">PQR</a></div><div class="sidebar-section-children"><a href="global.html#PRMTOP">PRMTOP</a></div><div class="sidebar-section-children"><a href="global.html#SDF">SDF</a></div><div class="sidebar-section-children"><a href="global.html#SurfaceType">SurfaceType</a></div><div class="sidebar-section-children"><a href="global.html#VASP">VASP</a></div><div class="sidebar-section-children"><a href="global.html#XYZ">XYZ</a></div><div class="sidebar-section-children"><a href="global.html#assignPDBBonds">assignPDBBonds</a></div><div class="sidebar-section-children"><a href="global.html#builtinColorSchemes">builtinColorSchemes</a></div><div class="sidebar-section-children"><a href="global.html#builtinGradients">builtinGradients</a></div><div class="sidebar-section-children"><a href="global.html#conversionMatrix3">conversionMatrix3</a></div><div class="sidebar-section-children"><a href="global.html#createViewer">createViewer</a></div><div class="sidebar-section-children"><a href="global.html#createViewerGrid">createViewerGrid</a></div><div class="sidebar-section-children"><a href="global.html#decode">decode</a></div><div class="sidebar-section-children"><a href="global.html#dic">dic</a></div><div class="sidebar-section-children"><a href="global.html#download">download</a></div><div class="sidebar-section-children"><a href="global.html#elementColors">elementColors</a></div><div class="sidebar-section-children"><a href="global.html#get">get</a></div><div class="sidebar-section-children"><a href="global.html#getColorFromStyle">getColorFromStyle</a></div><div class="sidebar-section-children"><a href="global.html#getbin">getbin</a></div><div class="sidebar-section-children"><a href="global.html#parseV3000">parseV3000</a></div><div class="sidebar-section-children"><a href="global.html#setSyncSurface">setSyncSurface</a></div><div class="sidebar-section-children"><a href="global.html#ssColors">ssColors</a></div><div class="sidebar-section-children"><a href="global.html#syncSurface">syncSurface</a></div><div class="sidebar-section-children"><a href="global.html#viewers">viewers</a></div></div></div></div></div><div class="navbar-container" id="VuAckcnZhf"><nav class="navbar"><div class="navbar-left-items"><div class="navbar-item"><a id="" href="https://3dmol.org/doc/index.html" target="">Documentation</a></div><div class="navbar-item"><a id="" href="tutorial-home.html" target="">Tutorials</a></div><div class="navbar-item"><a id="" href="https://github.com/3dmol/3Dmol.js" target="_blank">GitHub</a></div></div><div class="navbar-right-items"><div class="navbar-right-item"><button class="icon-button search-button" aria-label="open-search"><svg><use xlink:href="#search-icon"></use></svg></button></div><div class="navbar-right-item"><button class="icon-button theme-toggle" aria-label="toggle-theme"><svg><use class="theme-svg-use" xlink:href="#dark-theme-icon"></use></svg></button></div><div class="navbar-right-item"><button class="icon-button font-size" aria-label="change-font-size"><svg><use xlink:href="#font-size-icon"></use></svg></button></div></div><nav></nav></nav></div><div class="toc-container"><div class="toc-content"><span class="bold">On this page</span><div id="eed4d2a0bfd64539bb9df78095dec881"></div></div></div><div class="body-wrapper"><div class="main-content"><div class="main-wrapper"><section><header><h1 id="GLModel-title" class="has-anchor">GLModel</h1><div class="class-description"><p>GLModel represents a group of related atoms</p></div></header><article><div class="container-overview"><h2 id="constructor" class="has-anchor">Constructor</h2><h3 class="name has-anchor" id="GLModel"><span class="type-signature"></span>new GLModel<span class="signature">()</span></h3><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl></div><h2 id="classes" class="subsection-title has-anchor">Classes</h2><dl><dt><a href="GLModel.html">GLModel</a></dt><dd></dd></dl><h2 id="methods" class="subsection-title has-anchor">Methods</h2><h3 class="name has-anchor" id="addAtomSpecs"><span class="type-signature"></span>addAtomSpecs<span class="signature">(customAtomSpecs)</span></h3><div class="description"><p>add atomSpecs to validAtomSelectionSpecs</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>customAtomSpecs</code></td><td class="type"><span class="param-type">Array</span></td><td class="description last"><p>array of strings that can be used as atomSelectionSpecs<br>this is to prevent the 'Unknown Selector x' message on the console for the strings passed.<br>These messages are no longer generated as, in theory, typescript will catch problems at compile time.<br>In practice, there may still be issues at run-time but we don't check for them...</p><p>What we should do is use something like https://github.com/woutervh-/typescript-is to do runtime<br>type checking, but it currently doesn't work with our types...</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="important tag-deprecated bold">Deprecated</dt><dd class="tag-deprecated"><ul><li>Yes</li></ul></dd></div><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="addAtoms"><span class="type-signature"></span>addAtoms<span class="signature">(newatoms)</span></h3><div class="description"><p>Add list of new atoms to model. Adjusts bonds appropriately.</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>newatoms</code></td><td class="type"><span class="param-type">Array.<<a href="AtomSpec.html">AtomSpec</a>></span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Example</strong><div class="rel"><pre class="prettyprint"><code>var atoms = [{elem: 'C', x: 0, y: 0, z: 0, bonds: [1,2], bondOrder: [1,2]}, {elem: 'O', x: -1.5, y: 0, z: 0, bonds: [0]},{elem: 'O', x: 1.5, y: 0, z: 0, bonds: [0], bondOrder: [2]}];
viewer.setBackgroundColor(0xffffffff);
var m = viewer.addModel();
m.addAtoms(atoms);
m.setStyle({},{stick:{}});
viewer.zoomTo();
viewer.render();</code></pre></div></div><h3 class="name has-anchor" id="addFrame"><span class="type-signature"></span>addFrame<span class="signature">(atoms)</span></h3><div class="description"><p>Add atoms as frames of model</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>atoms</code></td><td class="type"><span class="param-type">Array.<<a href="AtomSpec.html">AtomSpec</a>></span></td><td class="description last"><p>atoms to be added</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="addMolData"><span class="type-signature"></span>addMolData<span class="signature">(data, format, options)</span></h3><div class="description"><p>add atoms to this model from molecular data string</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>data</code></td><td class="type"><span class="param-type">string</span> |<wbr> <span class="param-type">ArrayBuffer</span></td><td class="description last"><p>atom structure file input data string, for gzipped input use ArrayBuffer</p></td></tr><tr><td class="name"><code>format</code></td><td class="type"><span class="param-type">string</span></td><td class="description last"><p>input file string format (e.g 'pdb', 'sdf', 'sdf.gz', etc.)</p></td></tr><tr><td class="name"><code>options</code></td><td class="type"><span class="param-type"><a href="ParserOptionsSpec.html">ParserOptionsSpec</a></span></td><td class="description last"><p>format dependent options. Attributes depend on the input format</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="addPropertyLabels"><span class="type-signature"></span>addPropertyLabels<span class="signature">(prop, sel, options)</span></h3><div class="description"><p>Create labels for atoms that show the value of the passed property.</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>prop</code></td><td class="type"><span class="param-type">String</span></td><td class="description last"><p>property name</p></td></tr><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>options</code></td><td class="type"><span class="param-type"><a href="LabelSpec.html">LabelSpec</a></span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="addResLabels"><span class="type-signature"></span>addResLabels<span class="signature">(sel, options, byframe)</span></h3><div class="description"><p>Create labels for residues of selected atoms.<br>Will create a single label at the center of mass of all atoms<br>with the same chain,resn, and resi.</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>options</code></td><td class="type"><span class="param-type"><a href="LabelSpec.html">LabelSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>byframe</code></td><td class="type"><span class="param-type">boolean</span></td><td class="description last"><p>if true, create labels for every individual frame, not just current; frames must be loaded already</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="assignBonds"><span class="type-signature"></span>assignBonds<span class="signature">()</span></h3><div class="description"><p>Assign bonds based on atomic coordinates.<br>This currently uses a primitive distance-based algorithm that does not<br>consider valence constraints and will only create single bonds.</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="atomIsSelected"><span class="type-signature"></span>atomIsSelected<span class="signature">(atom, sel)</span><span class="type-signature"> → {boolean}</span></h3><div class="description"><p>given a selection specification, return true if atom is selected.<br>Does not support context-aware selectors like expand/within/byres.</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>atom</code></td><td class="type"><span class="param-type"><a href="AtomSpec.html">AtomSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><dl class="param-type"><dt>Type: </dt><dd><span class="param-type">boolean</span></dd></dl></div><h3 class="name has-anchor" id="createMolObj"><span class="type-signature"></span>createMolObj<span class="signature">()</span></h3><div class="description"><p>param {AtomSpec[]} atoms</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="drawAtomClickSphere"><span class="type-signature"></span>drawAtomClickSphere<span class="signature">()</span></h3><div class="description"><p>Register atom shaped click handlers</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="drawAtomCross"><span class="type-signature"></span>drawAtomCross<span class="signature">(atom, geos)</span></h3><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>atom</code></td><td class="type"><span class="param-type"><a href="AtomSpec.html">AtomSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>geos</code></td><td class="type"><span class="param-type">Record.<number, Geometry></span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="drawAtomSphere"><span class="type-signature"></span>drawAtomSphere<span class="signature">(atom, geo)</span></h3><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>atom</code></td><td class="type"><span class="param-type"><a href="AtomSpec.html">AtomSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>geo</code></td><td class="type"><span class="param-type">Geometry</span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="drawBondLines"><span class="type-signature"></span>drawBondLines<span class="signature">(atom, atoms, geos)</span></h3><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>atom</code></td><td class="type"><span class="param-type"><a href="AtomSpec.html">AtomSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>atoms</code></td><td class="type"><span class="param-type">Array.<<a href="AtomSpec.html">AtomSpec</a>></span></td><td class="description last"></td></tr><tr><td class="name"><code>geos</code></td><td class="type"><span class="param-type">Record.<number, Geometry></span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="enableContextMenu"><span class="type-signature"></span>enableContextMenu<span class="signature">(sel, contextMenuEnabled)</span></h3><div class="description"><p>enable context menu of selected atoms</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"><p>atom selection to apply hoverable settings to</p></td></tr><tr><td class="name"><code>contextMenuEnabled</code></td><td class="type"><span class="param-type">boolean</span></td><td class="description last"><p>whether contextMenu-handling is enabled for the selection</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="expandAtomList"><span class="type-signature"></span>expandAtomList<span class="signature">()</span></h3><div class="description"><p>returns a list of atoms in the expanded bounding box, but not in the current one</p><p>Bounding box:</p><p>[ [ xmin, ymin, zmin ],<br>[ xmax, ymax, zmax ],<br>[ xctr, yctr, zctr ] ]</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="exportVRML"><span class="type-signature"></span>exportVRML<span class="signature">()</span></h3><div class="description"><p>return a VRML string representation of the model. Does not include VRML header information</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><div class="param-desc"><p>VRML</p></div></div><h3 class="name has-anchor" id="getCrystData"><span class="type-signature"></span>getCrystData<span class="signature">()</span></h3><div class="description"><p>Returns crystallographic information if present.</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="getID"><span class="type-signature"></span>getID<span class="signature">()</span><span class="type-signature"> → {number}</span></h3><div class="description"><p>Returns model id number</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><div class="param-desc"><p>Model ID</p></div><dl class="param-type"><dt>Type: </dt><dd><span class="param-type">number</span></dd></dl></div><h3 class="name has-anchor" id="getInternalState"><span class="type-signature"></span>getInternalState<span class="signature">()</span></h3><div class="description"><p>Return object representing internal state of<br>the model appropriate for passing to setInternalState</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="getNumFrames"><span class="type-signature"></span>getNumFrames<span class="signature">()</span><span class="type-signature"> → {number}</span></h3><div class="description"><p>Returns model's frames property, a list of atom lists</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><dl class="param-type"><dt>Type: </dt><dd><span class="param-type">number</span></dd></dl></div><h3 class="name has-anchor" id="getRadiusFromStyle"><span class="type-signature"></span>getRadiusFromStyle<span class="signature">(atom, style)</span><span class="type-signature"> → {number}</span></h3><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>atom</code></td><td class="type"><span class="param-type"><a href="AtomSpec.html">AtomSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>style</code></td><td class="type"><span class="param-type">atomstyle</span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><dl class="param-type"><dt>Type: </dt><dd><span class="param-type">number</span></dd></dl></div><h3 class="name has-anchor" id="getSymmetries"><span class="type-signature"></span>getSymmetries<span class="signature">()</span><span class="type-signature"> → {Array.<<a href="Matrix4.html">Matrix4</a>>}</span></h3><div class="description"><p>Returns list of rotational/translational matrices if there is BIOMT data<br>Otherwise returns a list of just the ID matrix</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><dl class="param-type"><dt>Type: </dt><dd><span class="param-type">Array.<<a href="Matrix4.html">Matrix4</a>></span></dd></dl></div><h3 class="name has-anchor" id="getViewer"><span class="type-signature"></span>getViewer<span class="signature">()</span></h3><div class="description"><p>Return viewer associated with this model.</p></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><div class="param-desc"><p>GLViewer</p></div></div><h3 class="name has-anchor" id="globj"><span class="type-signature"></span>globj<span class="signature">(group, Object)</span></h3><div class="description"><p>manage the globj for this model in the possed modelGroup - if it has to be regenerated, remove and add</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>group</code></td><td class="type"><span class="param-type">Object3D</span></td><td class="description last"></td></tr><tr><td class="name"><code>Object</code></td><td class="type"></td><td class="description last"><p>options</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="hide"><span class="type-signature"></span>hide<span class="signature">()</span></h3><div class="description"><p>Don't show this model in future renderings. Keep all styles and state<br>so it can be efficiencly shown again.</p><ul><li>@see GLModel#show</li></ul></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Example</strong><div class="rel"><pre class="prettyprint"><code>$3Dmol.download("pdb:3ucr",viewer,{},function(){
viewer.setStyle({},{stick:{}});
viewer.getModel().hide();
viewer.render();
});</code></pre></div></div><h3 class="name has-anchor" id="removeAtoms"><span class="type-signature"></span>removeAtoms<span class="signature">(badatoms)</span></h3><div class="description"><p>Remove specified atoms from model</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>badatoms</code></td><td class="type"><span class="param-type">Array.<<a href="AtomSpec.html">AtomSpec</a>></span></td><td class="description last"><p>list of atoms</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="removegl"><span class="type-signature"></span>removegl<span class="signature">(group)</span></h3><div class="description"><p>Remove any renderable mol object from scene</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>group</code></td><td class="type"><span class="param-type">Object3D</span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="selectedAtoms"><span class="type-signature"></span>selectedAtoms<span class="signature">(sel)</span><span class="type-signature"> → {Array.<Object>}</span></h3><div class="description"><p>return list of atoms selected by sel, this is specific to glmodel</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container mt-20"><strong>Returns:</strong><dl class="param-type"><dt>Type: </dt><dd><span class="param-type">Array.<Object></span></dd></dl></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Example</strong><div class="rel"><pre class="prettyprint"><code>$3Dmol.download("pdb:4wwy",viewer,{},function(){
var atoms = viewer.selectedAtoms({chain:'A'});
for(var i = 0, n = atoms.length; i < n; i++) {
atoms[i].b = 0.0;
}
viewer.setStyle({cartoon:{colorscheme:{prop:'b',gradient: 'roygb',min:0,max:30}}});
viewer.render();
});</code></pre></div></div><h3 class="name has-anchor" id="setClickable"><span class="type-signature"></span>setClickable<span class="signature">(sel, clickable, callback)</span></h3><div class="description"><p>Set clickable and callback of selected atoms</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"><p>atom selection to apply clickable settings to</p></td></tr><tr><td class="name"><code>clickable</code></td><td class="type"><span class="param-type">boolean</span></td><td class="description last"><p>whether click-handling is enabled for the selection</p></td></tr><tr><td class="name"><code>callback</code></td><td class="type"><span class="param-type">function</span></td><td class="description last"><p>function called when an atom in the selection is clicked</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="setColorByElement"><span class="type-signature"></span>setColorByElement<span class="signature">(sel, colors)</span></h3><div class="description"><p>given a mapping from element to color, set atom colors</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>colors</code></td><td class="type"><span class="param-type">object</span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="setColorByFunction"><span class="type-signature"></span>setColorByFunction<span class="signature">(sel, func)</span></h3><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"><p>selection object</p></td></tr><tr><td class="name"><code>func</code></td><td class="type"><span class="param-type">function</span></td><td class="description last"><p>function to be used to set the color</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="important tag-deprecated bold">Deprecated</dt><dd><ul><li>use setStyle and colorfunc attribute</li></ul></dd></div><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Example</strong><div class="rel"><pre class="prettyprint"><code>$3Dmol.download("pdb:4UAA",viewer,{},function(){
viewer.setBackgroundColor(0xffffffff);
var colorAsSnake = function(atom) {
return atom.resi % 2 ? 'white': 'green'
};
viewer.setStyle( {}, { cartoon: {colorfunc: colorAsSnake }});
viewer.render();
});</code></pre></div></div><h3 class="name has-anchor" id="setColorByProperty"><span class="type-signature"></span>setColorByProperty<span class="signature">(sel, prop, scheme)</span></h3><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>sel</code></td><td class="type"><span class="param-type"><a href="AtomSelectionSpec.html">AtomSelectionSpec</a></span></td><td class="description last"></td></tr><tr><td class="name"><code>prop</code></td><td class="type"><span class="param-type">string</span></td><td class="description last"></td></tr><tr><td class="name"><code>scheme</code></td><td class="type"><span class="param-type">Gradient</span> |<wbr> <span class="param-type">string</span></td><td class="description last"></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><h3 class="name has-anchor" id="setCoordinates"><span class="type-signature"></span>setCoordinates<span class="signature">(str, format)</span></h3><div class="description"><p>Set coordinates for the atoms from provided trajectory file.</p></div><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Parameters:</strong><table class="params"><thead><tr><th>Name</th><th>Type</th><th class="last">Description</th></tr></thead><tbody><tr><td class="name"><code>str</code></td><td class="type"><span class="param-type">string</span> |<wbr> <span class="param-type">ArrayBuffer</span></td><td class="description last"><p>contains the data of the file</p></td></tr><tr><td class="name"><code>format</code></td><td class="type"><span class="param-type">string</span></td><td class="description last"><p>contains the format of the file (mdcrd, inpcrd, pdb, netcdf, or array). Arrays should be TxNx3 where T is the number of timesteps and N the number of atoms.</p></td></tr></tbody></table></div><dl class="details"><div class="details-item-container"><dt class="tag-source bold">Source</dt><dd class="tag-source"><ul><li><a href="GLModel.ts.html">GLModel.ts</a></li></ul></dd></div></dl><div class="method-member-container flex flex-col w-100 overflow-auto mt-20"><strong>Example</strong><div class="rel"><pre class="prettyprint"><code>let m = viewer.addModel() //create an empty model
m.addAtoms([{x:0,y:0,z:0,elem:'C'},{x:2,y:0,z:0,elem:'C'}]) //provide a list of dictionaries representing the atoms
viewer.setStyle({'sphere':{}})
m.setCoordinates([[[0.0, 0.0, 0.0], [2.0, 0.0, 0.0]], [[0.0, 0.0, 0.0], [2.8888888359069824, 0.0, 0.0]], [[0.0, 0.0, 0.0], [3.777777671813965, 0.0, 0.0]], [[0.0, 0.0, 0.0], [4.666666507720947, 0.0, 0.0]], [[0.0, 0.0, 0.0], [5.55555534362793, 0.0, 0.0]], [[0.0, 0.0, 0.0], [6.44444465637207, 0.0, 0.0]], [[0.0, 0.0, 0.0], [7.333333492279053, 0.0, 0.0]], [[0.0, 0.0, 0.0], [8.222222328186035, 0.0, 0.0]], [[0.0, 0.0, 0.0], [9.11111068725586, 0.0, 0.0]], [[0.0, 0.0, 0.0], [10.0, 0.0, 0.0]]],'array');
viewer.animate({loop: "forward",reps: 1});
viewer.zoomTo();
viewer.zoom(0.5);
v