Tutorial > Movie3D Canvas

The MovieCanvas3D constructor takes a name, width and height. The MovieCanvas3D class is a child of the Canvas3D class which is in turn a child of the Canvas class. The MovieCanvas3D class also extends the AnimatorCanvas class.

new ChemDoodle.MovieCanvas3D(name, width, height);

The MovieCanvas3D component provides functionality for playing molecule movies. The movies respond to the same input events that the rest of the components listen to, so you can make them interactive. You add frames to the movie with the MovieCanvas3D.addFrame() function. The addFrame() function takes two parameters, the first an Array of Molecule data structures, and the second an Array of 3D Shape data structures. This array can be populated with your data in any way you see fit, as long as the frames are in order. They can be read in from individual files, loaded from a movie file, or programmatically generated.

Playback speed is controlled by the MovieCanvas3D.timeout variable. This variable is the pause between frames in milliseconds. By default, it is 50ms, which is 20 frames per second.

There are several playback modes which will specify how the animation is to proceed:

  • PLAY_ONCE - specifies that movie will play once to the end and stop
  • PLAY_LOOP - specifies that movie will play continuously, restarting from the first frame once it reaches the end
  • PLAY_SPRING - specifies that movie will play continuously, springing back and forth between the first and last frames

hese variables are accessed from the MovieCanvas3D class, and will be defined when set to the MovieCanvas3D.playMode variable. By default, the play mode is PLAY_SPRING.

You should preload the first frame using the _Canvas.loadMolecule() function on the first Molecule in the molecules array, after the array is fully loaded. This will center the animation in the component.

When everything is ready, the AnimatorCanvas.startAnimation() function will start the movie while the AnimatorCanvas.stopAnimation() function will stop it. For convenience, the animation can be toggled by the user by double-clicking on the canvas.

Examples

A MovieCanvas3D component showing conformations of cyclohexane:

<script>
  let movie = new ChemDoodle.MovieCanvas3D('movie', 300, 300);
  // load the frames, which are read in from a XYZ movie file that has been split into the individual XYZ files to be read by the ChemDoodle.readXYZ() function
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -38.59443 KCAL = -161.47910 KJ; FOR REACTION COORDINATE = -176.55290 DEG\nC                0.0000      0.0000      0.0000\nC                1.5158      0.0000      0.0000\nC                2.0591      1.4144      0.0000\nC                1.5171      2.2065      1.1728\nC                0.0013      2.2193      1.1610\nC               -0.5553      0.8094      1.1544\nH                3.1787      1.3865      0.0508\nH                1.8900     -0.5445      0.9063\nH                1.8916     -0.5483     -0.9024\nH               -0.3710      0.4307     -0.9674\nH               -0.3761     -1.0540      0.0635\nH                1.8698      1.7417      2.1311\nH                1.9069      3.2559      1.1353\nH               -0.3773      2.7684      2.0618\nH               -0.3611      2.7691      0.2531\nH               -0.2976      0.3033      2.1219\nH               -1.6733      0.8476      1.0818\nH                1.7779      1.9242     -0.9586\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -38.34625 KCAL = -160.44071 KJ; FOR REACTION COORDINATE = -170.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5142      0.0000      0.0000\nC                2.1041      1.3951      0.0000\nC                1.5080      2.2796      1.0740\nC               -0.0041      2.2924      1.0153\nC               -0.5666      0.8896      1.0886\nH                3.2140      1.3278      0.1453\nH                1.8780     -0.5488      0.9096\nH                1.8862     -0.5593     -0.8980\nH               -0.3795      0.3358     -0.9991\nH               -0.3658     -1.0450      0.1843\nH                1.8512      1.9295      2.0828\nH                1.8921      3.3262      0.9451\nH               -0.4074      2.9010      1.8664\nH               -0.3372      2.7799      0.0617\nH               -0.3264      0.4464      2.0911\nH               -1.6832      0.9267      0.9963\nH                1.9264      1.8677     -1.0028\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -37.72036 KCAL = -157.82199 KJ; FOR REACTION COORDINATE = -165.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5138      0.0000      0.0000\nC                2.1364      1.3811      0.0000\nC                1.4968      2.3420      0.9775\nC               -0.0110      2.3507      0.8663\nC               -0.5781      0.9584      1.0224\nH                3.2300      1.2890      0.2320\nH                1.8701     -0.5521      0.9117\nH                1.8830     -0.5676     -0.8944\nH               -0.3840      0.2546     -1.0204\nH               -0.3598     -1.0279      0.2754\nH                1.8192      2.0915      2.0218\nH                1.8837      3.3765      0.7704\nH               -0.4419      3.0253      1.6512\nH               -0.3077      2.7648     -0.1337\nH               -0.3513      0.5800      2.0544\nH               -1.6935      0.9890      0.9140\nH                2.0526      1.8133     -1.0338\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -36.83616 KCAL = -154.12251 KJ; FOR REACTION COORDINATE = -160.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5138      0.0000      0.0000\nC                2.1670      1.3663      0.0000\nC                1.4865      2.4059      0.8617\nC               -0.0149      2.4083      0.6962\nC               -0.5905      1.0333      0.9378\nH                3.2342      1.2568      0.3292\nH                1.8633     -0.5566      0.9126\nH                1.8788     -0.5753     -0.8917\nH               -0.3842      0.1649     -1.0385\nH               -0.3564     -1.0014      0.3645\nH                1.7786      2.2631      1.9347\nH                1.8818      3.4185      0.5722\nH               -0.4699      3.1412      1.4128\nH               -0.2749      2.7458     -0.3416\nH               -0.3859      0.7299      1.9987\nH               -1.7036      1.0612      0.8054\nH                2.1885      1.7481     -1.0576\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -35.80020 KCAL = -149.78803 KJ; FOR REACTION COORDINATE = -155.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5133      0.0000      0.0000\nC                2.1947      1.3527      0.0000\nC                1.4718      2.4689      0.7200\nC               -0.0206      2.4536      0.4931\nC               -0.6067      1.1056      0.8382\nH                3.2198      1.2374      0.4430\nH                1.8573     -0.5602      0.9134\nH                1.8752     -0.5830     -0.8886\nH               -0.3829      0.0695     -1.0501\nH               -0.3534     -0.9673      0.4510\nH                1.7196      2.4420      1.8133\nH                1.8792      3.4491      0.3460\nH               -0.5036      3.2488      1.1194\nH               -0.2381      2.6932     -0.5813\nH               -0.4266      0.8911      1.9251\nH               -1.7167      1.1235      0.6797\nH                2.3377      1.6702     -1.0702\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -34.71743 KCAL = -145.25772 KJ; FOR REACTION COORDINATE = -150.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5139      0.0000      0.0000\nC                2.2198      1.3416      0.0000\nC                1.4578      2.5262      0.5519\nC               -0.0224      2.4826      0.2631\nC               -0.6199      1.1759      0.7229\nH                3.1834      1.2374      0.5669\nH                1.8537     -0.5644      0.9128\nH                1.8707     -0.5890     -0.8871\nH               -0.3790     -0.0313     -1.0541\nH               -0.3529     -0.9244      0.5337\nH                1.6505      2.6212      1.6531\nH                1.8842      3.4612      0.0932\nH               -0.5323      3.3367      0.7804\nH               -0.1944      2.6067     -0.8389\nH               -0.4610      1.0634      1.8283\nH               -1.7266      1.1803      0.5426\nH                2.5004      1.5823     -1.0632\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -33.69361 KCAL = -140.97405 KJ; FOR REACTION COORDINATE = -145.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5144      0.0000      0.0000\nC                2.2402      1.3325      0.0000\nC                1.4488      2.5715      0.3574\nC               -0.0168      2.4908      0.0086\nC               -0.6293      1.2413      0.5919\nH                3.1179      1.2588      0.6971\nH                1.8532     -0.5693      0.9103\nH                1.8661     -0.5932     -0.8869\nH               -0.3738     -0.1353     -1.0487\nH               -0.3554     -0.8734      0.6115\nH                1.5763      2.7947      1.4503\nH                1.8998      3.4477     -0.1848\nH               -0.5468      3.3968      0.4032\nH               -0.1423      2.4860     -1.1062\nH               -0.4902      1.2427      1.7053\nH               -1.7331      1.2287      0.3927\nH                2.6683      1.4871     -1.0296\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.86477 KCAL = -137.50619 KJ; FOR REACTION COORDINATE = -140.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5154      0.0000      0.0000\nC                2.2491      1.3280      0.0000\nC                1.4499      2.6012      0.1761\nC               -0.0007      2.4792     -0.2208\nC               -0.6323      1.2919      0.4657\nH                3.0359      1.2959      0.8017\nH                1.8557     -0.5742      0.9065\nH                1.8627     -0.5932     -0.8892\nH               -0.3701     -0.2333     -1.0332\nH               -0.3593     -0.8155      0.6842\nH                1.5287      2.9469      1.2415\nH                1.9263      3.4104     -0.4423\nH               -0.5463      3.4182      0.0585\nH               -0.0834      2.3608     -1.3332\nH               -0.5126      1.3949      1.5765\nH               -1.7325      1.2653      0.2496\nH                2.8041      1.4072     -0.9763\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.30529 KCAL = -135.16535 KJ; FOR REACTION COORDINATE = -135.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5153      0.0000      0.0000\nC                2.2545      1.3254      0.0000\nC                1.4506      2.6085     -0.0029\nC                0.0141      2.4458     -0.4351\nC               -0.6379      1.3268      0.3410\nH                2.9371      1.3478      0.8929\nH                1.8591     -0.5783      0.9021\nH                1.8590     -0.5911     -0.8926\nH               -0.3678     -0.3282     -1.0084\nH               -0.3600     -0.7527      0.7527\nH                1.4855      3.0680      1.0215\nH                1.9525      3.3455     -0.6874\nH               -0.5385      3.4065     -0.2639\nH               -0.0347      2.2210     -1.5328\nH               -0.5384      1.5274      1.4405\nH               -1.7335      1.2846      0.1058\nH                2.9267      1.3378     -0.9025\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.08211 KCAL = -134.23155 KJ; FOR REACTION COORDINATE = -130.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5160      0.0000      0.0000\nC                2.2534      1.3263      0.0000\nC                1.4620      2.5999     -0.2167\nC                0.0456      2.3808     -0.6915\nC               -0.6373      1.3571      0.1858\nH                2.7990      1.4237      0.9785\nH                1.8656     -0.5818      0.8969\nH                1.8566     -0.5863     -0.8975\nH               -0.3611     -0.4315     -0.9725\nH               -0.3673     -0.6820      0.8128\nH                1.4347      3.1806      0.7450\nH                2.0013      3.2447     -0.9613\nH               -0.5150      3.3511     -0.6606\nH                0.0461      2.0268     -1.7557\nH               -0.5637      1.6733      1.2594\nH               -1.7270      1.2952     -0.0705\nH                3.0502      1.2702     -0.7922\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.18014 KCAL = -134.64170 KJ; FOR REACTION COORDINATE = -125.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5159      0.0000      0.0000\nC                2.2428      1.3316      0.0000\nC                1.4804      2.5690     -0.4305\nC                0.0829      2.2910     -0.9343\nC               -0.6331      1.3704      0.0284\nH                2.6332      1.5152      1.0389\nH                1.8726     -0.5831      0.8924\nH                1.8561     -0.5783     -0.9032\nH               -0.3541     -0.5302     -0.9268\nH               -0.3745     -0.6066      0.8663\nH                1.3938      3.2621      0.4503\nH                2.0601      3.1117     -1.2221\nH               -0.4786      3.2561     -1.0332\nH                0.1235      1.8190     -1.9503\nH               -0.5847      1.7972      1.0644\nH               -1.7163      1.2884     -0.2494\nH                3.1493      1.2241     -0.6562\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.54234 KCAL = -136.15714 KJ; FOR REACTION COORDINATE = -120.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5163      0.0000      0.0000\nC                2.2281      1.3379      0.0000\nC                1.5071      2.5259     -0.6069\nC                0.1296      2.1951     -1.1355\nC               -0.6244      1.3700     -0.1161\nH                2.4800      1.5973      1.0653\nH                1.8780     -0.5820      0.8905\nH                1.8583     -0.5718     -0.9067\nH               -0.3499     -0.6181     -0.8732\nH               -0.3804     -0.5275      0.9136\nH                1.3848      3.3144      0.1848\nH                2.1266      2.9687     -1.4291\nH               -0.4266      3.1432     -1.3548\nH                0.2109      1.6239     -2.0970\nH               -0.6068      1.8890      0.8778\nH               -1.6988      1.2681     -0.4207\nH                3.2108      1.2026     -0.5280\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -33.09095 KCAL = -138.45251 KJ; FOR REACTION COORDINATE = -115.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5158      0.0000      0.0000\nC                2.2085      1.3479      0.0000\nC                1.5269      2.4759     -0.7496\nC                0.1630      2.1079     -1.2900\nC               -0.6207      1.3567     -0.2359\nH                2.3381      1.6715      1.0694\nH                1.8819     -0.5789      0.8901\nH                1.8616     -0.5654     -0.9090\nH               -0.3490     -0.6923     -0.8159\nH               -0.3822     -0.4455      0.9555\nH                1.3897      3.3414     -0.0457\nH                2.1795      2.8262     -1.5905\nH               -0.3859      3.0381     -1.5893\nH                0.2686      1.4700     -2.2059\nH               -0.6299      1.9491      0.7165\nH               -1.6859      1.2327     -0.5624\nH                3.2430      1.2054     -0.4137\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -33.72467 KCAL = -141.10403 KJ; FOR REACTION COORDINATE = -110.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5168      0.0000      0.0000\nC                2.1897      1.3569      0.0000\nC                1.5591      2.4194     -0.8796\nC                0.2045      2.0186     -1.4249\nC               -0.6080      1.3408     -0.3428\nH                2.2035      1.7393      1.0573\nH                1.8851     -0.5753      0.8910\nH                1.8667     -0.5600     -0.9103\nH               -0.3514     -0.7551     -0.7559\nH               -0.3853     -0.3602      0.9895\nH                1.4172      3.3520     -0.2691\nH                2.2444      2.6725     -1.7291\nH               -0.3346      2.9262     -1.8013\nH                0.3303      1.3187     -2.2922\nH               -0.6367      1.9939      0.5685\nH               -1.6654      1.1998     -0.6863\nH                3.2619      1.2163     -0.3019\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -34.36118 KCAL = -143.76717 KJ; FOR REACTION COORDINATE = -105.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5163      0.0000      0.0000\nC                2.1637      1.3681      0.0000\nC                1.5921      2.3547     -0.9998\nC                0.2489      1.9240     -1.5527\nC               -0.5984      1.3116     -0.4583\nH                2.0613      1.8052      1.0305\nH                1.8873     -0.5716      0.8916\nH                1.8715     -0.5546     -0.9110\nH               -0.3515     -0.8168     -0.6882\nH               -0.3853     -0.2725      1.0169\nH                1.4509      3.3438     -0.4866\nH                2.3107      2.5094     -1.8450\nH               -0.2770      2.8089     -1.9957\nH                0.3962      1.1752     -2.3744\nH               -0.6644      2.0248      0.4047\nH               -1.6409      1.1396     -0.8320\nH                3.2629      1.2427     -0.1889\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -34.90759 KCAL = -146.05335 KJ; FOR REACTION COORDINATE = -100.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5165      0.0000      0.0000\nC                2.1308      1.3836      0.0000\nC                1.6209      2.2852     -1.1086\nC                0.2890      1.8242     -1.6677\nC               -0.5896      1.2751     -0.5638\nH                1.9143      1.8682      0.9900\nH                1.8899     -0.5650      0.8942\nH                1.8791     -0.5497     -0.9102\nH               -0.3537     -0.8692     -0.6186\nH               -0.3851     -0.1828      1.0367\nH                1.4843      3.3202     -0.6950\nH                2.3725      2.3450     -1.9367\nH               -0.2238      2.6824     -2.1741\nH                0.4543      1.0293     -2.4414\nH               -0.6867      2.0420      0.2490\nH               -1.6192      1.0739     -0.9576\nH                3.2455      1.2872     -0.0796\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -35.29061 KCAL = -147.65592 KJ; FOR REACTION COORDINATE = -95.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5165      0.0000      0.0000\nC                2.1066      1.3933      0.0000\nC                1.6521      2.2265     -1.1845\nC                0.3250      1.7553     -1.7473\nC               -0.5812      1.2396     -0.6496\nH                1.8078      1.9108      0.9505\nH                1.8910     -0.5610      0.8959\nH                1.8845     -0.5467     -0.9092\nH               -0.3585     -0.9108     -0.5500\nH               -0.3829     -0.0918      1.0498\nH                1.5468      3.2945     -0.8565\nH                2.4270      2.1989     -1.9935\nH               -0.1741      2.5995     -2.2898\nH                0.5010      0.9367     -2.4941\nH               -0.7179      2.0419      0.1227\nH               -1.5930      1.0054     -1.0708\nH                3.2256      1.3220      0.0013\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -35.43405 KCAL = -148.25608 KJ; FOR REACTION COORDINATE = -90.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5172      0.0000      0.0000\nC                2.0773      1.4065      0.0000\nC                1.6702      2.1770     -1.2416\nC                0.3470      1.7015     -1.8103\nC               -0.5806      1.1995     -0.7246\nH                1.7076      1.9454      0.9123\nH                1.8927     -0.5555      0.8982\nH                1.8914     -0.5428     -0.9079\nH               -0.3646     -0.9459     -0.4794\nH               -0.3759      0.0000      1.0569\nH                1.6029      3.2676     -0.9884\nH                2.4629      2.0723     -2.0282\nH               -0.1444      2.5392     -2.3700\nH                0.5316      0.8738     -2.5446\nH               -0.7643      2.0274      0.0092\nH               -1.5714      0.9260     -1.1718\nH                3.1955      1.3666      0.0682\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -35.15942 KCAL = -147.10700 KJ; FOR REACTION COORDINATE = 145.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5156      0.0000      0.0000\nC                2.0546      1.4144      0.0000\nC                1.7020      2.1275     -1.2890\nC                0.3535      1.7053     -1.8409\nC               -0.5838      1.1625     -0.7812\nH                1.6241      1.9733      0.8722\nH                1.8923     -0.5523      0.8995\nH                1.8944     -0.5396     -0.9074\nH               -0.3637     -0.9686     -0.4335\nH               -0.3754      0.0460      1.0560\nH                1.7061      3.2341     -1.1049\nH                2.4910      1.9225     -2.0597\nH               -0.1413      2.5879     -2.3258\nH                0.5031      0.9227     -2.6304\nH               -0.8517      1.9895     -0.0727\nH               -1.5271      0.8292     -1.2895\nH                3.1678      1.3985      0.1299\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -34.65585 KCAL = -145.00008 KJ; FOR REACTION COORDINATE = 140.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5146      0.0000      0.0000\nC                2.0373      1.4215      0.0000\nC                1.7148      2.1009     -1.3139\nC                0.3587      1.7039     -1.8651\nC               -0.5908      1.1184     -0.8376\nH                1.5713      1.9887      0.8478\nH                1.8925     -0.5491      0.9007\nH                1.8971     -0.5376     -0.9067\nH               -0.3634     -0.9907     -0.3809\nH               -0.3726      0.0991      1.0537\nH                1.7538      3.2126     -1.1676\nH                2.5038      1.8452     -2.0696\nH               -0.1397      2.6107     -2.3012\nH                0.5011      0.9600     -2.6924\nH               -0.9439      1.9393     -0.1600\nH               -1.4823      0.7255     -1.3960\nH                3.1459      1.4234      0.1640\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -34.00290 KCAL = -142.26813 KJ; FOR REACTION COORDINATE = 135.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5134      0.0000      0.0000\nC                2.0307      1.4231      0.0000\nC                1.7309      2.0779     -1.3308\nC                0.3657      1.7124     -1.8819\nC               -0.5925      1.0736     -0.8936\nH                1.5446      1.9987      0.8303\nH                1.8908     -0.5482      0.9016\nH                1.8975     -0.5379     -0.9058\nH               -0.3645     -1.0092     -0.3276\nH               -0.3703      0.1540      1.0481\nH                1.8055      3.1914     -1.2135\nH                2.5154      1.7779     -2.0753\nH               -0.1351      2.6452     -2.2585\nH                0.4991      1.0201     -2.7544\nH               -1.0346      1.8783     -0.2488\nH               -1.4264      0.6232     -1.4971\nH                3.1357      1.4330      0.1859\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -33.31678 KCAL = -139.39741 KJ; FOR REACTION COORDINATE = 130.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5119      0.0000      0.0000\nC                2.0240      1.4250      0.0000\nC                1.7237      2.0737     -1.3328\nC                0.3444      1.7472     -1.8725\nC               -0.6074      1.0347     -0.9275\nH                1.5340      1.9997      0.8288\nH                1.8895     -0.5467      0.9023\nH                1.8981     -0.5371     -0.9053\nH               -0.3632     -1.0223     -0.2875\nH               -0.3654      0.1899      1.0446\nH                1.8318      3.1860     -1.2276\nH                2.4926      1.7440     -2.0815\nH               -0.1623      2.7066     -2.1665\nH                0.4604      1.1272     -2.8004\nH               -1.1379      1.8043     -0.3063\nH               -1.3785      0.5310     -1.5717\nH                3.1284      1.4410      0.1873\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.69707 KCAL = -136.80454 KJ; FOR REACTION COORDINATE = 125.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5114      0.0000      0.0000\nC                2.0251      1.4232      0.0000\nC                1.7082      2.0856     -1.3205\nC                0.3086      1.8124     -1.8346\nC               -0.6230      1.0079     -0.9462\nH                1.5511      1.9934      0.8412\nH                1.8876     -0.5465      0.9033\nH                1.8977     -0.5393     -0.9040\nH               -0.3624     -1.0300     -0.2603\nH               -0.3604      0.2123      1.0425\nH                1.8576      3.1932     -1.2145\nH                2.4500      1.7342     -2.0874\nH               -0.2009      2.7965     -2.0247\nH                0.3933      1.2902     -2.8253\nH               -1.2424      1.7235     -0.3417\nH               -1.3269      0.4627     -1.6331\nH                3.1331      1.4339      0.1692\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.25889 KCAL = -134.97121 KJ; FOR REACTION COORDINATE = 120.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5110      0.0000      0.0000\nC                2.0266      1.4215      0.0000\nC                1.7027      2.0851     -1.3186\nC                0.2877      1.8531     -1.8092\nC               -0.6284      0.9710     -0.9799\nH                1.5597      1.9917      0.8451\nH                1.8857     -0.5467      0.9040\nH                1.8970     -0.5408     -0.9033\nH               -0.3639     -1.0385     -0.2215\nH               -0.3572      0.2504      1.0355\nH                1.8867      3.1886     -1.2252\nH                2.4201      1.7048     -2.0952\nH               -0.2211      2.8514     -1.9068\nH                0.3473      1.4224     -2.8456\nH               -1.3311      1.6346     -0.4063\nH               -1.2608      0.3853     -1.7022\nH                3.1359      1.4301      0.1612\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.07744 KCAL = -134.21200 KJ; FOR REACTION COORDINATE = 115.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5109      0.0000      0.0000\nC                2.0222      1.4226      0.0000\nC                1.6968      2.0838     -1.3188\nC                0.2672      1.8896     -1.7834\nC               -0.6285      0.9354     -1.0140\nH                1.5537      1.9931      0.8441\nH                1.8858     -0.5453      0.9049\nH                1.8977     -0.5411     -0.9027\nH               -0.3654     -1.0451     -0.1844\nH               -0.3547      0.2878      1.0267\nH                1.9144      3.1822     -1.2414\nH                2.3905      1.6732     -2.1019\nH               -0.2397      2.8935     -1.7929\nH                0.2997      1.5497     -2.8551\nH               -1.4074      1.5456     -0.4791\nH               -1.1851      0.3142     -1.7681\nH                3.1315      1.4343      0.1613\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.20434 KCAL = -134.74296 KJ; FOR REACTION COORDINATE = 110.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5104      0.0000      0.0000\nC                2.0293      1.4191      0.0000\nC                1.6782      2.0954     -1.3041\nC                0.2313      1.9449     -1.7273\nC               -0.6326      0.9101     -1.0332\nH                1.5851      1.9842      0.8607\nH                1.8838     -0.5466      0.9050\nH                1.8960     -0.5436     -0.9020\nH               -0.3672     -1.0487     -0.1590\nH               -0.3516      0.3126      1.0210\nH                1.9286      3.1871     -1.2305\nH                2.3365      1.6686     -2.1092\nH               -0.2701      2.9464     -1.6276\nH                0.2239      1.7169     -2.8296\nH               -1.4833      1.4504     -0.5321\nH               -1.1113      0.2670     -1.8218\nH                3.1423      1.4222      0.1348\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -32.63798 KCAL = -136.55730 KJ; FOR REACTION COORDINATE = 105.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5097      0.0000      0.0000\nC                2.0444      1.4119      0.0000\nC                1.6577      2.1276     -1.2719\nC                0.1933      2.0182     -1.6425\nC               -0.6329      0.9008     -1.0402\nH                1.6411      1.9657      0.8886\nH                1.8821     -0.5492      0.9041\nH                1.8917     -0.5455     -0.9030\nH               -0.3693     -1.0490     -0.1511\nH               -0.3515      0.3222      1.0182\nH                1.9321      3.2122     -1.1819\nH                2.2749      1.7074     -2.1126\nH               -0.3010      3.0015     -1.4114\nH                0.1360      1.9199     -2.7634\nH               -1.5459      1.3654     -0.5720\nH               -1.0305      0.2530     -1.8690\nH                3.1616      1.3975      0.0948\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -33.34283 KCAL = -139.50639 KJ; FOR REACTION COORDINATE = 100.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5106      0.0000      0.0000\nC                2.0459      1.4116      0.0000\nC                1.6421      2.1382     -1.2611\nC                0.1661      2.0559     -1.5869\nC               -0.6261      0.8784     -1.0620\nH                1.6564      1.9607      0.8975\nH                1.8830     -0.5489      0.9042\nH                1.8917     -0.5458     -0.9031\nH               -0.3702     -1.0514     -0.1295\nH               -0.3517      0.3458      1.0103\nH                1.9388      3.2172     -1.1780\nH                2.2267      1.7059     -2.1186\nH               -0.3211      3.0135     -1.2557\nH                0.0680      2.0584     -2.7093\nH               -1.5914      1.2797     -0.6416\nH               -0.9407      0.2238     -1.9204\nH                3.1646      1.3946      0.0780\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -34.23848 KCAL = -143.25381 KJ; FOR REACTION COORDINATE = 95.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5110      0.0000      0.0000\nC                2.0529      1.4087      0.0000\nC                1.6354      2.1481     -1.2500\nC                0.1487      2.0910     -1.5286\nC               -0.6114      0.8618     -1.0840\nH                1.6790      1.9536      0.9068\nH                1.8826     -0.5491      0.9046\nH                1.8900     -0.5488     -0.9023\nH               -0.3732     -1.0517     -0.1133\nH               -0.3555      0.3669      1.0010\nH                1.9520      3.2215     -1.1724\nH                2.1872      1.7073     -2.1242\nH               -0.3277      3.0145     -1.0995\nH                0.0093      2.1909     -2.6422\nH               -1.6203      1.2029     -0.7155\nH               -0.8395      0.2086     -1.9696\nH                3.1725      1.3850      0.0621\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -35.24500 KCAL = -147.46510 KJ; FOR REACTION COORDINATE = 90.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5112      0.0000      0.0000\nC                2.0601      1.4062      0.0000\nC                1.6184      2.1599     -1.2336\nC                0.1227      2.1239     -1.4623\nC               -0.6025      0.8486     -1.0989\nH                1.7083      1.9461      0.9187\nH                1.8833     -0.5510      0.9033\nH                1.8876     -0.5476     -0.9045\nH               -0.3745     -1.0524     -0.1013\nH               -0.3571      0.3826      0.9944\nH                1.9524      3.2281     -1.1593\nH                2.1352      1.7152     -2.1270\nH               -0.3405      3.0015     -0.9355\nH               -0.0598      2.3183     -2.5571\nH               -1.6460      1.1298     -0.7805\nH               -0.7447      0.2057     -2.0093\nH                3.1804      1.3764      0.0380\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -36.26816 KCAL = -151.74596 KJ; FOR REACTION COORDINATE = 85.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5119      0.0000      0.0000\nC                2.0655      1.4052      0.0000\nC                1.5957      2.1805     -1.2108\nC                0.0932      2.1584     -1.3861\nC               -0.5924      0.8411     -1.1095\nH                1.7400      1.9345      0.9345\nH                1.8843     -0.5521      0.9023\nH                1.8861     -0.5477     -0.9053\nH               -0.3754     -1.0525     -0.0947\nH               -0.3599      0.3918      0.9894\nH                1.9415      3.2445     -1.1314\nH                2.0777      1.7429     -2.1263\nH               -0.3549      2.9760     -0.7597\nH               -0.1355      2.4479     -2.4502\nH               -1.6646      1.0609     -0.8437\nH               -0.6484      0.2193     -2.0431\nH                3.1863      1.3701      0.0085\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -37.20527 KCAL = -155.66683 KJ; FOR REACTION COORDINATE = 80.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5127      0.0000      0.0000\nC                2.0700      1.4045      0.0000\nC                1.5704      2.2070     -1.1811\nC                0.0621      2.1930     -1.3011\nC               -0.5836      0.8398     -1.1150\nH                1.7757      1.9207      0.9522\nH                1.8856     -0.5519      0.9022\nH                1.8857     -0.5477     -0.9058\nH               -0.3753     -1.0525     -0.0942\nH               -0.3630      0.3956      0.9864\nH                1.9242      3.2672     -1.0903\nH                2.0181      1.7860     -2.1210\nH               -0.3671      2.9357     -0.5767\nH               -0.2137      2.5744     -2.3230\nH               -1.6759      1.0025     -0.8976\nH               -0.5545      0.2503     -2.0700\nH                3.1905      1.3637     -0.0253\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -37.93698 KCAL = -158.72834 KJ; FOR REACTION COORDINATE = 75.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5136      0.0000      0.0000\nC                2.0735      1.4039      0.0000\nC                1.5422      2.2394     -1.1436\nC                0.0296      2.2274     -1.2054\nC               -0.5759      0.8446     -1.1155\nH                1.8161      1.9044      0.9716\nH                1.8872     -0.5505      0.9028\nH                1.8861     -0.5476     -0.9059\nH               -0.3744     -1.0525     -0.0999\nH               -0.3663      0.3939      0.9855\nH                1.9011      3.2960     -1.0351\nH                1.9546      1.8441     -2.1099\nH               -0.3753      2.8798     -0.3871\nH               -0.2948      2.6985     -2.1726\nH               -1.6825      0.9508     -0.9457\nH               -0.4636      0.2991     -2.0893\nH                3.1926      1.3578     -0.0632\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -38.47390 KCAL = -160.97480 KJ; FOR REACTION COORDINATE = 70.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5143      0.0000      0.0000\nC                2.0727      1.4065      0.0000\nC                1.5394      2.2149     -1.1642\nC                0.0252      2.2151     -1.1970\nC               -0.5559      0.8183     -1.1470\nH                1.8000      1.9154      0.9621\nH                1.8885     -0.5517      0.9016\nH                1.8856     -0.5472     -0.9066\nH               -0.3766     -1.0531     -0.0753\nH               -0.3707      0.4218      0.9713\nH                1.9121      3.2696     -1.0919\nH                1.9311      1.7846     -2.1237\nH               -0.3631      2.8220     -0.3370\nH               -0.3223      2.7225     -2.1359\nH               -1.6711      0.8896     -1.0414\nH               -0.3548      0.2854     -2.1135\nH                3.1919      1.3662     -0.0533\n')], []);
  movie.addFrame([ChemDoodle.readXYZ('18\nHEAT OF FORMATION = -38.62079 KCAL = -161.58938 KJ; FOR REACTION COORDINATE = 66.00000 DEG\nC                0.0000      0.0000      0.0000\nC                1.5152      0.0000      0.0000\nC                2.0658      1.4114      0.0000\nC                1.5158      2.2171     -1.1593\nC                0.0008      2.2167     -1.1613\nC               -0.5509      0.8056     -1.1590\nH                1.7974      1.9162      0.9652\nH                1.8905     -0.5497      0.9020\nH                1.8880     -0.5457     -0.9064\nH               -0.3755     -1.0543     -0.0638\nH               -0.3729      0.4328      0.9654\nH                1.8909      3.2715     -1.0954\nH                1.8899      1.7842     -2.1243\nH               -0.3727      2.7646     -0.2563\nH               -0.3736      2.7647     -2.0647\nH               -1.6694      0.8405     -1.0936\nH               -0.2855      0.2995     -2.1242\nH                3.1845      1.3782     -0.0629\n')], []);
  movie.styles.set3DRepresentation('Ball and Stick');
  movie.styles.backgroundColor = 'black';
  // preload the first frame of the movie
  movie.loadMolecule(movie.frames[0].mols[0]);
  // start the movie
  movie.startAnimation();
</script>

Get your work done with our popular desktop software.