mschoi/3Dmol.js
1
0
Fork 0
mirror of https://github.com/3dmol/3Dmol.js.git synced 2026-06-04 08:39:49 +09:00
Code Issues Packages Projects Releases Wiki Activity

Updated Docs and Added Bullet Point Config

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

14
doc.md
View File

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

1
jsdoc.conf.json
View File

@@ -40,6 +40,7 @@
"displayModuleHeader": true, "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>", "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", "title": "3Dmol.js",
"create_style": "article ul li { list-style: disc}",
"menu": [ "menu": [
{ {
"title": " Documentation", "title": " Documentation",

28
tutorials/embeddable.md
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> <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: 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. - **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. - **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. - **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. - **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). - **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). - **data-backgroundcolor** The background color (default black).
7. **data-backgroundalpha** The background alpha (default opaque: 1.0). - **data-backgroundalpha** The background alpha (default opaque: 1.0).
8. **data-select** The value is an {@link AtomSpec} selection specification. - **data-select** The value is an {@link AtomSpec} selection specification.
9. **data-style** The value is a style specification. - **data-style** The value is a style specification.
10. **data-surface** A surface style specification. - **data-surface** A surface style specification.
11. **data-labelres** A residue label style specification. - **data-labelres** A residue label style specification.
12. **data-zoomto** An {@link AtomSpec} selection specification to zoom to. - **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') - **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-ui** If set will show the UI for the viewer.
Multiple selections, styles, residue labels, and surfaces can be provided by appending a suffix Multiple selections, styles, residue labels, and surfaces can be provided by appending a suffix
each tag. each tag.

8
tutorials/home.md
View File

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