Updated Docs and Added Bullet Point Config

Signed-off-by: Adithya Krishna <adikrish@redhat.com>
This commit is contained in:
Adithya Krishna
2023-08-29 19:01:48 +00:00
parent e5cf4f580d
commit bd0198a8f2
4 changed files with 26 additions and 25 deletions

14
doc.md
View File

@@ -19,13 +19,13 @@ With 3Dmol.js, you can add beautifully rendered molecular visualizations to your
Features include:
1. Support for pdb, sdf, mol2, xyz, and cube formats
2. Parallelized molecular surface computation
3. Sphere, stick, line, cross, cartoon, and surface styles
4. Atom property based selection and styling
5. Labels
6. Clickable interactivity with molecular data
7. Geometric shapes including spheres and arrows
- Support for pdb, sdf, mol2, xyz, and cube formats
- Parallelized molecular surface computation
- Sphere, stick, line, cross, cartoon, and surface styles
- Atom property based selection and styling
- Labels
- Clickable interactivity with molecular data
- Geometric shapes including spheres and arrows
## Getting Started

View File

@@ -40,6 +40,7 @@
"displayModuleHeader": true,
"footer":"3Dmol.js © 2019-2023 | <a href='https://pitt.edu/' target='_blank'>University of Pittsburg</a> | <a href='https://github.com/3dmol/3Dmol.js/blob/master/LICENSE' target='_blank'>License</a>",
"title": "3Dmol.js",
"create_style": "article ul li { list-style: disc}",
"menu": [
{
"title": " Documentation",

View File

@@ -14,20 +14,20 @@ The code below is all that is needed to create the displayed viewer.
<div style="height: 500px; width: 500px; position: relative;" class='viewer_3Dmoljs' data-pdb='2POR' data-backgroundcolor='0xffffff' data-style='stick' data-ui='true'></div>
The contents of the viewer can be set and manipulated through the use of `data-` tags, as shown above. Supported tags include:
1. **data-pdb** The value describes a PDB ID to be loaded into the viewer.
2. **data-cid** The value describes a PubChem compound id to be loaded into the viewer.
3. **data-href** The value is a URL to a molecular data file.
4. **data-element** The value is the id of an HTML element on the current page that has molecular data embedded in it.
5. **data-type** The value is the file format (default pdb; can be pdb, sdf, xyz, mol2, or cube).
6. **data-backgroundcolor** The background color (default black).
7. **data-backgroundalpha** The background alpha (default opaque: 1.0).
8. **data-select** The value is an {@link AtomSpec} selection specification.
9. **data-style** The value is a style specification.
10. **data-surface** A surface style specification.
11. **data-labelres** A residue label style specification.
12. **data-zoomto** An {@link AtomSpec} selection specification to zoom to.
13. **data-spin** If set will spin the model using {@link $3Dmol.GLViewer#spin}. Can specify axis and speed (e.g. data-spin='axis:z;speed:10')
14. **data-ui** If set will show the UI for the viewer.
- **data-pdb** The value describes a PDB ID to be loaded into the viewer.
- **data-cid** The value describes a PubChem compound id to be loaded into the viewer.
- **data-href** The value is a URL to a molecular data file.
- **data-element** The value is the id of an HTML element on the current page that has molecular data embedded in it.
- **data-type** The value is the file format (default pdb; can be pdb, sdf, xyz, mol2, or cube).
- **data-backgroundcolor** The background color (default black).
- **data-backgroundalpha** The background alpha (default opaque: 1.0).
- **data-select** The value is an {@link AtomSpec} selection specification.
- **data-style** The value is a style specification.
- **data-surface** A surface style specification.
- **data-labelres** A residue label style specification.
- **data-zoomto** An {@link AtomSpec} selection specification to zoom to.
- **data-spin** If set will spin the model using {@link $3Dmol.GLViewer#spin}. Can specify axis and speed (e.g. data-spin='axis:z;speed:10')
- **data-ui** If set will show the UI for the viewer.
Multiple selections, styles, residue labels, and surfaces can be provided by appending a suffix
each tag.

View File

@@ -1,7 +1,7 @@
This guide helps you with learning how to,
1. [Use 3Dmol within your code](tutorial-code.html)
2. [Embedding a 3Dmol Viewer](tutorial-embeddable.html)
3. [Active Learning with 3Dmol.js](tutorial-learning_environment.html)
4. [Hosted 3Dmol.js viewer](tutorial-url.html)
- [Use 3Dmol within your code](tutorial-code.html)
- [Embedding a 3Dmol Viewer](tutorial-embeddable.html)
- [Active Learning with 3Dmol.js](tutorial-learning_environment.html)
- [Hosted 3Dmol.js viewer](tutorial-url.html)