Collections:
addBox() - Create 3D Boxes
How to create 3D Boxes with 3Dmol.js addBox() methods?
✍: FYIcenter.com
viewer.addBox() method in the $3Dmol.GLViewer class
allows you to create 3D box objects.
Here is the signature of the addBox() method:
{$3Dmol.GLViewer} addBox({BoxSpec} spec) -> {$3Dmol.GLShape}
Here is an HTML code example, Draw-Box.html, that uses the addBox() method:
<html><head>
<script src="/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.addBox({center:{x:0,y:0,z:0},dimensions: {w:3,h:4,d:2},color:'magenta'});
viewer.zoomTo();
viewer.rotate(45, {x:1,y:1,z:1});
viewer.render();
});
</script>
</body></html>
This example HTML code will display a 3D box as shown below:
⇒ addLabel() - Create Text Labels
⇐ GLViewer Class and Instance Methods
⇑⇑ 3Dmol.js FAQ
2023-09-07, 817🔥, 0💬
Popular Posts:
Molecule Summary: ID: FYI-1004627 Names: InChIKey: LUOBYKKIRAGUEP-UHFFFAOYS A-NSMILES: C1CN%17C1C%15...
Molecule Summary: ID: FYI-1001006 SMILES: C\\C=C(\\C)/C(=O)O[C@@H] 1CCN2CC=C(COC(=O)[C@@](O )([C@H](C)...
What Is "obgen" command? How to use it to Generate Molecule 3D Structures? "obgen" command is a comm...
Molecule Summary: ID: FYI-1001173 SMILES: NC1=NC=C(C2=CC=C(S(=O)(C 3(C[C@@](O)(C)CCCCCCO4)C C3)=O)C=C2...
Molecule Summary: ID: FYI-1002195 Names: InChIKey: ZNSQICMTTCTJBW-JSKKQJDMS A-NSMILES: Cc6ccc(C3C(N(...