Atom Biology General Molecule Reaction Tools Trial Virus

Load Data by URL into Embedded 3Dmol Viewer

Q

How to load data by URL into the Embedded 3Dmol Viewer?

✍: FYIcenter.com

A

You can use "data-href" and "data-type" attributes on the DIV element to load molecule data from a URL into the Embedded 3Dmol Viewer.

Here is an HTML code example, Embedded-Viewer-data-href.html, that loads a Benzene molecule in SDF format with a URL: 

<html>
<body>
<div style="width: 400px; height: 400px; position: relative;"
  class="viewer_3Dmoljs"
  data-href="https://3dmol.org/tests/test_structs/benzene.sdf"
  data-type="sdf"
  data-style='stick'
  data-surface='opacity:.7;color:white'
  data-ui="true"
></div>
<script src="/3Dmol-min.js"></script>
</body></html>

This example HTML code will displays the Benzene molecule structure:

Embedded 3Dmol Viewer - data-href={URL} Example
Embedded 3Dmol Viewer - data-href={URL} Example

 

⇒ Load Data from Another HTML Element

⇐ 3Dmol.js Bug - data-ui=true Impacts on Selection

⇑ Using Embedded 3Dmol Viewer

⇑⇑ 3Dmol.js FAQ

2023-09-10, 716🔥, 0💬

Atom Biology General Molecule Reaction Tools Trial Virus