UNPKG

crystvis-js

Version:

A Three.js based crystallographic visualisation tool

3,094 lines (953 loc) 61.1 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Adding favicon --> <!-- Adding meta --> <!-- Adding external script--> <!-- Adding external style--> <!-- Adding scripts--> <!-- Adding style--> <!-- Adding overlay script--> <!-- Adding overlay style--> <title> ModelView </title> <!--[if lt IE 9]> <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <link type="text/css" rel="stylesheet" href="styles/third-party/ionicons.min.css"> <link type="text/css" rel="stylesheet" href="styles/third-party/prettify-tomorrow.css"> <link type="text/css" rel="stylesheet" href="styles/reset.css"> <link type="text/css" rel="stylesheet" href="styles/clean-jsdoc-theme-base.css"> <link type="text/css" rel="stylesheet" href="styles/clean-jsdoc-theme-dark.css"> <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="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> </defs> </svg> </head> <body> <nav class="navbar" id="navbar"> <div class="navbar-heading" id="navbar-heading"><a href="index.html"><h2 class="navbar-heading-text">Home</h2></a></div><div class="search-box" id="search-box"><div class="search-box-input-container"><input class="search-box-input" type="text" placeholder="Search..." id="search-box-input" /><svg class="search-icon" alt="search-icon"><use xlink:href="#search-icon"></use></svg></div><div class="search-item-container" id="search-item-container"><ul class="search-item-ul" id="search-item-ul"></ul></div></div><div class="sidebar-main-content" id="sidebar-main-content"><div class="accordion collapsed" id="9953002" > <h3 class="accordion-heading">Modules<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion-list" id=""><a href="lib_model.module_js.html">lib/model.js</a></li><li class="accordion-list" id=""><a href="lib_modelview.module_js.html">lib/modelview.js</a></li><li class="accordion-list" id=""><a href="lib_visualizer.module_js.html">lib/visualizer.js</a></li></ul> </div><div class="accordion collapsed" id="3878701" > <h3 class="accordion-heading">Classes<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion collapsed child" id=6175172><div class="accordion-heading child"><a href="lib_model.module_js-AtomImage.html">AtomImage</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="lib_model.module_js-AtomImage.html#addEllipsoid">addEllipsoid</a></li><li data-type='method'><a href="lib_model.module_js-AtomImage.html#addLabel">addLabel</a></li><li data-type='method'><a href="lib_model.module_js-AtomImage.html#ellipsoidProperty">ellipsoidProperty</a></li><li data-type='method'><a href="lib_model.module_js-AtomImage.html#getArrayValue">getArrayValue</a></li><li data-type='method'><a href="lib_model.module_js-AtomImage.html#labelProperty">labelProperty</a></li><li data-type='method'><a href="lib_model.module_js-AtomImage.html#removeEllipsoid">removeEllipsoid</a></li><li data-type='method'><a href="lib_model.module_js-AtomImage.html#removeLabel">removeLabel</a></li></ul></li><li class="accordion-list" id=""><a href="lib_model.module_js-BondImage.html">BondImage</a></li><li class="accordion collapsed child" id=6715610><div class="accordion-heading child"><a href="lib_model.module_js-Model.html">Model</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="lib_model.module_js-Model.html#absToFrac">absToFrac</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#addLink">addLink</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#addSphere">addSphere</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#clearGraphics">clearGraphics</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#deleteArray">deleteArray</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#find">find</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#fracToAbs">fracToAbs</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#getArray">getArray</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#hasArray">hasArray</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#minimumSupercell">minimumSupercell</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#removeGraphics">removeGraphics</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#setArray">setArray</a></li><li data-type='method'><a href="lib_model.module_js-Model.html#view">view</a></li></ul></li><li class="accordion collapsed child" id=2271872><div class="accordion-heading child"><a href="lib_modelview.module_js-ModelView.html">ModelView</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#addEllipsoids">addEllipsoids</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#addLabels">addLabels</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#and">and</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#ellipsoidProperties">ellipsoidProperties</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#find">find</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#hide">hide</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#labelProperties">labelProperties</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#map">map</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#not">not</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#or">or</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#removeEllipsoids">removeEllipsoids</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#removeLabels">removeLabels</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#setProperty">setProperty</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#show">show</a></li><li data-type='method'><a href="lib_modelview.module_js-ModelView.html#xor">xor</a></li></ul></li><li class="accordion collapsed child" id=6565660><div class="accordion-heading child"><a href="lib_visualizer.module_js-CrystVis.html">CrystVis</a><svg><use xlink:href="#down-icon"></use></svg></div><ul class='methods accordion-content'><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#addPrimitive">addPrimitive</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#centerCamera">centerCamera</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#deleteModel">deleteModel</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#displayModel">displayModel</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#getScreenshotData">getScreenshotData</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#loadModels">loadModels</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#onAtomBox">onAtomBox</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#onAtomClick">onAtomClick</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#reloadModel">reloadModel</a></li><li data-type='method'><a href="lib_visualizer.module_js-CrystVis.html#removePrimitive">removePrimitive</a></li></ul></li></ul> </div><div class="accordion collapsed" id="6000571" > <h3 class="accordion-heading">Tutorials<svg><use xlink:href="#down-icon"></use></svg></h3><ul class="accordion-content"><li class="accordion-list" id=""><a href="tutorial-Events.html">Events</a></li><li class="accordion-list" id=""><a href="tutorial-Queries.html">Queries</a></li></ul> </div> </nav> <div class="navbar-ham" id="navbar-ham"> <div> <div class="first"></div> <div class="second"></div> <div class="third"></div> </div> </div> <div id="main" class="main-content"> <h1 id='page-title' class="page-title"> ModelView </h1> <section> <header> <h2> <span class="ancestors"><a href="lib_modelview.module_js.html">lib/modelview.js</a>~</span> ModelView </h2> <div class="class-description"><p>A 'view' representing a subset of atom images of a model, used for selection and further manipulations</p></div> </header> <article> <div class="container-overview"> <h2>Constructor</h2> <h4 class="name" id="ModelView"> <a href="#ModelView">#</a> <span class="type-signature"></span>new ModelView<span class="signature">(model, indices)</span><span class="type-signature"></span> </h4> <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>model</code></td> <td class="type"> <span class="param-type">Model</span> </td> <td class="description last"><p>Model to use for the view</p></td> </tr> <tr> <td class="name"><code>indices</code></td> <td class="type"> <span class="param-type">Array.&lt;int></span> </td> <td class="description last"><p>Indices of the atom images to include in the view</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line12">line 12</a> </li></ul></dd> </div> </dl> </div> <h3 class="subsection-title">Members</h3> <h4 class="name" id="atoms"> <a href="#atoms">#</a> <span class="type-signature">(readonly) </span>atoms<span class="type-signature"> :Array.&lt;AtomImage></span> </h4> <div class="description"> <p>Atom images in this view</p> </div> <div class="member-item-container flex"> <strong>Type: </strong> <ul> <li> <span class="param-type">Array.&lt;AtomImage></span> </li> </ul> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line62">line 62</a> </li></ul></dd> </div> </dl> <h4 class="name" id="indices"> <a href="#indices">#</a> <span class="type-signature">(readonly) </span>indices<span class="type-signature"> :Array.&lt;int></span> </h4> <div class="description"> <p>Indices of the atom images in this view</p> </div> <div class="member-item-container flex"> <strong>Type: </strong> <ul> <li> <span class="param-type">Array.&lt;int></span> </li> </ul> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line53">line 53</a> </li></ul></dd> </div> </dl> <h4 class="name" id="length"> <a href="#length">#</a> <span class="type-signature">(readonly) </span>length<span class="type-signature"> :int</span> </h4> <div class="description"> <p>Number of atom images in this view</p> </div> <div class="member-item-container flex"> <strong>Type: </strong> <ul> <li> <span class="param-type">int</span> </li> </ul> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line71">line 71</a> </li></ul></dd> </div> </dl> <h4 class="name" id="model"> <a href="#model">#</a> <span class="type-signature">(readonly) </span>model<span class="type-signature"> :Model</span> </h4> <div class="description"> <p>Model used by this view</p> </div> <div class="member-item-container flex"> <strong>Type: </strong> <ul> <li> <span class="param-type">Model</span> </li> </ul> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line44">line 44</a> </li></ul></dd> </div> </dl> <h3 class="subsection-title">Methods</h3> <h4 class="name" id="addEllipsoids"> <a href="#addEllipsoids">#</a> <span class="type-signature"></span>addEllipsoids<span class="signature">(data, name, args)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Add ellipsoids to the atom images in this ModelView</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>data</code></td> <td class="type"> <span class="param-type">Object</span> | <span class="param-type">Array.&lt;Object></span> | <span class="param-type">function</span> </td> <td class="default"> </td> <td class="description last"><p>Data to use for the ellipsoid (see AtomImage.addEllipsoid for details)</p></td> </tr> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> ellipsoid </td> <td class="description last"><p>Name of the ellipsoids</p></td> </tr> <tr> <td class="name"><code>args</code></td> <td class="type"> <span class="param-type">Object</span> | <span class="param-type">Array.&lt;Object></span> | <span class="param-type">function</span> </td> <td class="default"> </td> <td class="description last"><p>Arguments for creating the ellipsoids</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line313">line 313</a> </li></ul></dd> </div> </dl> <h4 class="name" id="addLabels"> <a href="#addLabels">#</a> <span class="type-signature"></span>addLabels<span class="signature">(text, name, args)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Add labels to the atom images in this ModelView</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>text</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> </td> <td class="description last"><p>Text of the labels, as single value, array, or function returning a string for each atom image.</p></td> </tr> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> label </td> <td class="description last"><p>Name of the label</p></td> </tr> <tr> <td class="name"><code>args</code></td> <td class="type"> <span class="param-type">Object</span> | <span class="param-type">Array.&lt;Object></span> | <span class="param-type">function</span> </td> <td class="default"> </td> <td class="description last"><p>Arguments for creating the label</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line233">line 233</a> </li></ul></dd> </div> </dl> <h4 class="name" id="and"> <a href="#and">#</a> <span class="type-signature"></span>and<span class="signature">(mview)</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Intersection with another ModelView</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>mview</code></td> <td class="type"> <span class="param-type">ModelView</span> </td> <td class="description last"><p>Other view</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line132">line 132</a> </li></ul></dd> </div> </dl> <div class="method-member-container mt-20"> <strong>Returns:</strong> <div class="param-desc"> <p>Result</p> </div> <dl class="param-type"> <dt> Type </dt> <dd> <span class="param-type">ModelView</span> </dd> </dl> </div> <h4 class="name" id="ellipsoidProperties"> <a href="#ellipsoidProperties">#</a> <span class="type-signature"></span>ellipsoidProperties<span class="signature">(name, property, value)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Get or set ellipsoids' properties for the atom images in this ModelView</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> ellipsoid </td> <td class="description last"><p>Name of the ellipsoids</p></td> </tr> <tr> <td class="name"><code>property</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> color </td> <td class="description last"><p>Property to get or set</p></td> </tr> <tr> <td class="name"><code>value</code></td> <td class="type"> <span class="param-type">Any</span> | <span class="param-type">Array.&lt;Any></span> | <span class="param-type">function</span> </td> <td class="default"> null </td> <td class="description last"><p>If not provided, get. If provided, set this value</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line352">line 352</a> </li></ul></dd> </div> </dl> <h4 class="name" id="find"> <a href="#find">#</a> <span class="type-signature"></span>find<span class="signature">(query)</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Perform a further search within the atoms included in this ModelView.</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>query</code></td> <td class="type"> <span class="param-type">Array</span> </td> <td class="description last"><p>Query for the search, formatted as for the Model.find function.</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line120">line 120</a> </li></ul></dd> </div> </dl> <div class="method-member-container mt-20"> <strong>Returns:</strong> <div class="param-desc"> <p>Result of the query</p> </div> <dl class="param-type"> <dt> Type </dt> <dd> <span class="param-type">ModelView</span> </dd> </dl> </div> <h4 class="name" id="hide"> <a href="#hide">#</a> <span class="type-signature"></span>hide<span class="signature">()</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Make all atoms in the view invisible. Can be chained</p> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line91">line 91</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">ModelView</span> </dd> </dl> </div> <h4 class="name" id="labelProperties"> <a href="#labelProperties">#</a> <span class="type-signature"></span>labelProperties<span class="signature">(name, property, value)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Get or set labels' properties for the atom images in this ModelView</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> label </td> <td class="description last"><p>Name of the labels</p></td> </tr> <tr> <td class="name"><code>property</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> color </td> <td class="description last"><p>Property to get or set</p></td> </tr> <tr> <td class="name"><code>value</code></td> <td class="type"> <span class="param-type">Any</span> | <span class="param-type">Array.&lt;Any></span> | <span class="param-type">function</span> </td> <td class="default"> null </td> <td class="description last"><p>If not provided, get. If provided, set this value</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line279">line 279</a> </li></ul></dd> </div> </dl> <h4 class="name" id="map"> <a href="#map">#</a> <span class="type-signature"></span>map<span class="signature">(func)</span><span class="type-signature"> &rarr; {Array}</span> </h4> <div class="description"> <p>Run a function on each AtomImage, returning an Array of the results.</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>func</code></td> <td class="type"> <span class="param-type">function</span> </td> <td class="description last"><p>Function to run, should take AtomImage and index as arguments</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line104">line 104</a> </li></ul></dd> </div> </dl> <div class="method-member-container mt-20"> <strong>Returns:</strong> <div class="param-desc"> <p>Return values</p> </div> <dl class="param-type"> <dt> Type </dt> <dd> <span class="param-type">Array</span> </dd> </dl> </div> <h4 class="name" id="not"> <a href="#not">#</a> <span class="type-signature"></span>not<span class="signature">()</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Complement to this ModelView</p> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line167">line 167</a> </li></ul></dd> </div> </dl> <div class="method-member-container mt-20"> <strong>Returns:</strong> <div class="param-desc"> <p>Result</p> </div> <dl class="param-type"> <dt> Type </dt> <dd> <span class="param-type">ModelView</span> </dd> </dl> </div> <h4 class="name" id="or"> <a href="#or">#</a> <span class="type-signature"></span>or<span class="signature">(mview)</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Union with another ModelView</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>mview</code></td> <td class="type"> <span class="param-type">ModelView</span> </td> <td class="description last"><p>Other view</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line144">line 144</a> </li></ul></dd> </div> </dl> <div class="method-member-container mt-20"> <strong>Returns:</strong> <div class="param-desc"> <p>Result</p> </div> <dl class="param-type"> <dt> Type </dt> <dd> <span class="param-type">ModelView</span> </dd> </dl> </div> <h4 class="name" id="removeEllipsoids"> <a href="#removeEllipsoids">#</a> <span class="type-signature"></span>removeEllipsoids<span class="signature">(name)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Remove ellipsoids from the atom images in this ModelView</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> ellipsoid </td> <td class="description last"><p>Name of the ellipsoids to remove</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line332">line 332</a> </li></ul></dd> </div> </dl> <h4 class="name" id="removeLabels"> <a href="#removeLabels">#</a> <span class="type-signature"></span>removeLabels<span class="signature">(name)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Remove labels from the atom images in this ModelView</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> | <span class="param-type">Array.&lt;String></span> | <span class="param-type">function</span> </td> <td class="default"> label </td> <td class="description last"><p>Name of the labels to remove</p></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line259">line 259</a> </li></ul></dd> </div> </dl> <h4 class="name" id="setProperty"> <a href="#setProperty">#</a> <span class="type-signature"></span>setProperty<span class="signature">(name, value)</span><span class="type-signature"></span> </h4> <div class="description"> <p>Set some property of the atoms within the ModelView.</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>Default</th> <th class="last">Description</th> </tr> </thead> <tbody> <tr> <td class="name"><code>name</code></td> <td class="type"> <span class="param-type">String</span> </td> <td class="default"> </td> <td class="description last"><p>Name of the property to set</p></td> </tr> <tr> <td class="name"><code>value</code></td> <td class="type"> <span class="param-type">int</span> | <span class="param-type">Array</span> | <span class="param-type">function</span> </td> <td class="default"> null </td> <td class="description last"><p>Value to set for the atoms. It can be either:</p> <pre><code> 1. a single value for all of them 2. an Array of values as long as the ModelView 3. a function that accepts an AtomImage and an index and returns a value If left empty, the property is restored to its default value. </code></pre></td> </tr> </tbody> </table> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line205">line 205</a> </li></ul></dd> </div> </dl> <h4 class="name" id="show"> <a href="#show">#</a> <span class="type-signature"></span>show<span class="signature">()</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Make all atoms in the view visible. Can be chained</p> </div> <dl class="details"> <div class="details-item-container"> <dt class="tag-source">Source:</dt> <dd class="tag-source"><ul class="dummy"><li> <a href="modelview.js.html">modelview.js</a>, <a href="modelview.js.html#line82">line 82</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">ModelView</span> </dd> </dl> </div> <h4 class="name" id="xor"> <a href="#xor">#</a> <span class="type-signature"></span>xor<span class="signature">(mview)</span><span class="type-signature"> &rarr; {ModelView}</span> </h4> <div class="description"> <p>Exclusive OR with another ModelView</p> </div> <div class="method-member-container flex flex-col w-100 overflow-aut