Display molecular dynamics simulations in the browser!

durrantlab

<p>PCAViz is a tool for displaying molecular dynamics simulations in the browser. To encourage use, an easy-to-install PCAViz-powered WordPress plugin enables “plug-and-play” trajectory visualization. The PCAViz download also provides examples showing how to use PCAViz in any webpage.</p>
<h3>Examples of Use</h3>
<p>The PCAViz WordPress Plugin uses shortcodes that can be inserted into any WordPress post or page.</p>
<h3>Major Attributes</h3>
<ol>
<li>If you use the plugin without any attributes, it will allow your site visitors to select from any of the compressed JSON files you’ve uploaded to your WordPress media library. Note that these files must end in <code>.compressed.json</code> to be recognized. <code>[pcaviz]</code></li>
<li>If you want to show your site visitors a specific simulation present in your media library, simplify specify the name of the simulation. PCAViz will search through your media library and will choose the first JSON file ending in <code>.compressed.json</code> that includes your specified text in its title, URL, or file name. <code>[pcaviz file="larp1"]</code></li>
<li>
<p>You can also control the molecular styles. The WordPress plugin uses <a href="https://3dmol.csb.pitt.edu" rel="nofollow ugc">3DMol.js</a> to render molecules. Passing the plugin a <a href="https://3dmol.csb.pitt.edu/doc/types.html#AtomStyleSpec" rel="nofollow ugc">3DMol.js AtomStyleSpec</a> JSON string changes the way the molecules are displayed. <code>[pcaviz visStyle='{"cartoon": {"style": "trace", "color": "grey", "opacity": 0.75}}']</code></p>
<p>Note that the <a href="https://3dmol.csb.pitt.edu/doc/$3Dmol.GLViewer.html#setStyle" rel="nofollow ugc">3DMol.js documentation</a> shows AtomStyleSpec examples as JavaScript objects. PCAViz accepts only JSON strings. The two look similar, but with important differences (e.g., keys in JSON strings must always be quoted). We recommend using a <a href="https://jsonformatter.curiousconcept.com" rel="nofollow ugc">JSON validator</a> to check your AtomStyleSpec strings.</p>
</li>
</ol>
<h3>Minor Attributes</h3>
<ol>
<li>To explicitly specify the height and width of the viewer, in pixels: <code>[pcaviz height=150 width=150]</code></li>
<li>To align the viewer to the left, center, or right, and to optionally add a caption: <code>[pcaviz align="right" caption="My molecule in motion!"]</code></li>
<li>
<p>To instead use the caption associated with the <code>.compressed.json</code> file in your media library: <code>[pcaviz mediaLibraryCaption="true"]</code></p>
<p>(Note that this option is automatically set to true when no <code>file</code> attribute is specified.)</p>
</li>
<li>To hide the playback buttons: <code>[pcaviz playback_buttons="false"]</code></li>
<li>To prevent the plugin from looping the animation: <code>[pcaviz loop="false"]</code></li>
<li>The plugin starts playing the simulation automatically by default. To deactivate autoplay: <code>[pcaviz autoplay="false"]</code></li>
<li>To specify the duration of the animation and how frequently the atomic positions are updated: <code>[pcaviz durationInMilliseconds=10000 updateFreqInMilliseconds=50]</code></li>
<li>To smooth the animation by averaging the atomic coordinates over multiple frames: <code>[pcaviz windowAverageSize=25]</code></li>
<li>
<p>To control how the plugin caches calculated coordinates: <code>[pcaviz caching="continuous"]</code></p>
<p>Acceptable values are “none” (no caching), “continuous” (cache each frame’s coordinates after they are first calculated), and “pre” (calculate and cache all frame coordinates before starting the animation).</p>
</li>
</ol>


Alternatives to PCAViz

Top alternatives