3Dmol  ·  2018/03/04

3Dmol.jsでの分子軌道の表示

実行例

やったことはタイトル通り。分子の構造データが入ったsdfファイルに、分子軌道データが入ったcubeファイルを重ねて表示した。まずは全体のソースと実行例。 

<script src="https://cdnjs.cloudflare.com/ajax/libs/3Dmol/1.3.0/3Dmol-min.js"></script>

<script>
  var $3Dmol = $3Dmol || {};
  var $ = jQuery || {};
  var initShapes = function(viewer) {
      $.get('https://dl.dropboxusercontent.com/s/3txt5x1id37tn3r/benzene_HOMO.cube', function(data){
          var voldata = new $3Dmol.VolumeData(data, "cube");
          viewer.addIsosurface(voldata, {isoval: 0.02, color: "blue", alpha: 0.95, smoothness: 10});
          viewer.addIsosurface(voldata, {isoval: -0.02, color: "red", alpha: 0.95, smoothness: 10});
          viewer.setStyle({}, {stick:{}});
          viewer.zoomTo();
          //viewer.zoom(.75);
          viewer.render();
      }, 'text');
  };
</script>

<div style="height: 400px; width: 400px; position: relative;"  class='viewer_3Dmoljs' data-href="https://dl.dropboxusercontent.com/s/7gsituw96b43c83/benzene.sdf" data-datatype="sdf" data-callback='initShapes' data-backgroundcolor='0xf6f6f6'></div>

ベンゼンの構造とそのHOMO。計算はHF/3-21G。

ファイルのアップロード

本題とは関係ないのだが、個人的に重要だったので書いておく。拡張子がpbd, sdf, cubeなどのファイルをSSL通信で共有するのは、普通、有料のサーバーを使うしかない。しかし、Dropboxを用いれば、それらのファイルをアップロードできる。

 

① Dropboxにファイルをアップロードし、共有リンクを取得する。

② 共有リンクの末尾の「?dl=0」を消去し、「www.dropbox.com」の部分を「dl.dropboxusercontent.com」に置き換えて、ファイルに直接リンクできるようにする。

（例）「benzen.sdf」をDropboxにアップロードして取得したリンク

https://www.dropbox.com/s/7gsituw96b43c83/benzen.sdf?dl=0

「?dl=0」を消去し、「www.dropbox.com」の部分を「dl.dropboxusercontent.com」に置き換えて

https://dl.dropboxusercontent.com/s/7gsituw96b43c83/benzen.sdf

とする。