J-graph/html/mnovaFileDemo.html at main · NMReDATAInitiative/J-graph · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <script src="https://d3js.org/d3.v7.min.js"></script>
</head>

<body>
  <h4>Mnova json demonstration page</h4>
  <p>This page reads the json serialization of Mnova document and uses JSmol and CHEMeDATA viewers for their visualization.</p>
  <style>
    .code-box {
      background: #f4f4f4;
      padding: 10px;
      font-family: monospace;
    }
  </style>

  <script type="text/javascript" src="src/JSmol.min.js"></script>
    <p id="textMainPage" style="height:20px">J-graph output</p>
  <script>
    compoundStructure = {
      script: "set antialiasDisplay true;load ../data/santonin/santonin.mol;cartoon on;color cartoon structure; rotate z 45.0;rotate x 80;",
      width: 350,
      height: 200,
      j2sPath: "src/j2s",
      disableJ2SLoadMonitor: false,
      isableInitialConsole: true
    }
    Jmol.getApplet("JmolAppletAz", compoundStructure);
  </script>
  <div id="my_dataviz"></div>
  <script type="module">
    import { jGraph } from "../src/mnovaReader.js";
    var fName1 = "../data/santonin/santonin_spectrum.json";
    var fNameN = "../data/santonin/santonin_molecule.json"
    fNameN = "../data/santonin/santonin_moleculeWithAssignment.json"; // with partial assignment of J's
    var ajgraph = jGraph(fName1, fNameN, JmolAppletAz)
  </script>
  Brush horizontally to zoom and double-click to restore the full spectrum.
  <h2>J Graph</h2>
<p>The coupling constants are represented with dots (or blocks when assigned) on the vertical axes, given in Hz.</p>
<p>Hover over the labels to highlight the relevant atom(s) on the 3D model.</p>
<p>Hover over the dots/blocks to display the value of the coupling constant and dihedral angles with potential coupling partners.</p>
<p>Double-click on the coupling to pair the coupling constants when the ruler is green, indicating that the coupling partner is unambiguous. Try, for example, with J(8a,7a).</p>

  <h4>Make your own assignement page from Mnova documents</h4>
  Use "Save as" in Mnova >=15.1 and select the relevant (*.json) entries or use Mnova scripting:
  <div class="code-box">
    <pre><code>
serialization.save("c:/santonin.mol", "mol"); // for JSmol
serialization.save("c:/santonin_molecule.json", "JSON Molecule (*.json)") // for the J-graph
serialization.save("c:/santonin_spectrum.json", "JSON NMR (*.json)") // for the spectrum
</code></pre>
  </div>
</body>

</html>