Zum Inhalt

Plugin: 3Dmol

3Dmol.js ist eine Javascript-Bibliothek zur 3D-Visualisierung von Molekülen. Näheres ist auf der Projektseite unter https://3dmol.csb.pitt.edu/ zu finden. Die Lizenzbestimmung bzgl. 3Dmol.js entnehmen Sie bitte den dortigen Ressourcen.

Das 3Dmol-Plugin muss zunächst beim Player aktiviert werden.

Plugin aktivieren
var edmlplayer = new edML_Player("file.edml", document.querySelector('#edmloutput'));
edmlplayer.setConfig('plugins.threedmol.active',true);
edmlplayer.play();

Danach lässt sich das Plugin in einem objectblock-Element durch einen entsprechenden Attributwert aufrufen.

objectblock mit Plugin
<objectblock plugin="3dmol">
</objectblock>

Im Inhalt des objectblock-Elements werden die grundlegenden Eigenschaften im JSON-Format definiert, z. B.:

objectblock mit Plugin und JSON
<objectblock plugin="3dmol">
{
    "data": "/NaCl.sdf", 
    "datatype": "sdf", 
    "style": [{"atom":"Cs","stick": {"hidden":true, "radius":0.1},"sphere": {"radius": 0.6,"color":"red"}},{"atom":"Cl","stick": {"hidden":true, "radius":0.1},"sphere": {"radius": 0.6,"color":"blue"}}],
    "width":"400px",
    "height":"400px",
    "zoom":"0.8"
}
</objectblock>

Mit data wird die Datei definiert, in der sich die Daten befinden, die 3Dmol.js darstellen soll. Die Beschreibung der weiteren Parameter ist auf den Projektseiten von 3Dmol.js zu finden.

Beispiel einer sdf-Datei
 OpenBabel05062414003D

 27  1  0  0  0  0  0  0  0  0999 V2000
    0.0000    0.0000    0.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    0.0000    0.0000    3.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    0.0000    0.0000    6.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    0.0000    3.0000    0.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    0.0000    3.0000    3.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    0.0000    3.0000    6.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    0.0000    6.0000    0.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    0.0000    6.0000    3.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    0.0000    6.0000    6.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    3.0000    0.0000    0.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    3.0000    0.0000    3.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    3.0000    0.0000    6.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    3.0000    3.0000    0.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    3.0000    3.0000    3.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    3.0000    3.0000    6.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    3.0000    6.0000    0.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    3.0000    6.0000    3.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    3.0000    6.0000    6.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    6.0000    0.0000    0.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    6.0000    0.0000    3.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    6.0000    0.0000    6.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    6.0000    3.0000    0.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    6.0000    3.0000    3.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    6.0000    3.0000    6.0000 Na  0  0  0  0  0  0  0  0  0  0  0  0
    6.0000    6.0000    0.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
    6.0000    6.0000    3.0000 Na  0  0  0  0  0 15  0  0  0  0  0  0
    6.0000    6.0000    6.0000 Cl  0  0  0  0  0  0  0  0  0  0  0  0
 24 27  1  0  0  0  0
M  END
$$$$

Obiges Beispiel führt zur Ausgabe :

Hinweis: Ein häufiger Fehler ist eine fehlerhafte Pfadangabe. In der Entwicklungskonsole im Browser erscheint dann eine entsprechende Mitteilung.