Collections:
Use the Online Version of 3Dmol.js Library
How to use the online version of the 3Dmol.js Library to draw a graphical object? I don't want to install the library locally.
✍: FYIcenter.com
Yes, you can follow these steps to the online version of the 3Dmol.js library
to draw graphical objects.
The online version is located at
https://3Dmol.csb.pitt.edu/build/3Dmol-min.js.
Another online version is located at
https://3Dmol.org/build/3Dmol-min.js.
1. Create an HTML file, Draw-Sphere.html, with the following code:
<html><head> <script src="https://3Dmol.csb.pitt.edu/build/3Dmol-min.js"></script> <style> .mol-container {width: 400px; height: 400px; position: relative;} </style> </head> <body> <div id="container-01" class="mol-container"></div> <script> $(function() { let element = $('#container-01'); let config = { backgroundColor: 'grey' }; let viewer = $3Dmol.createViewer( element, config ); viewer.addSphere({ center: {x:0, y:0, z:0}, radius: 10.0, color: 'green' }); viewer.zoomTo(); viewer.render(); viewer.zoom(0.8, 2000); }); </script> </body></html>
2. Load this HTML file into a Web browser. You see a rather fetching green ball in front of an orange background.
Note that using the online version may cause possible issues:
Also note that older Web browsers may not support 3Dmol.js. For example, you may see the following error on an older Safari browser in the browser developer console.
error creating viewer: TypeError: undefined is not a constructor (evaluating 'new window.ResizeObserver(this.resize)') createViewer - 3Dmol-min.js:8134
⇒ Install 3Dmol.js Library Locally
⇑ Getting Started with 3Dmol.js
⇑⇑ 3Dmol.js FAQ
2022-12-24, 241👍, 0💬
Popular Posts:
How many command line tools are provided in the Open Babel package? By default, Open Babel package p...
Where to find FAQ (Frequently Asked Questions) on JSME Molecule Editor User Interface? Here is a lis...
What JSME Molecule Editor Options? JSME Molecule Editor Options are parameters that can be passed to...
Molecule Summary: ID: FYI-1002035 Names: InChIKey: JZRWCGZRTZMZEH-UHFFFAOYS A-NSMILES: CC1=C(SC=[N+]...
What Is SDF/Mol V3000 file format? SDF (Structural Data File) V3, also call Mol V3000 file, or Molfi...