NMRの形だけさくっと確認したいけれど、いちいちTopspinやRamoを起動しないと見れない。

またNMRの大体の形だけ確認したいけれど、手元にスマホしかない。

こんなときブラウザでNMRが見れたら非常に便利だと考えられます。

そこでjsを用いてNMRスペクトルを簡易的に表示できるサイトを作りました。

一番上の起動と書かれているボタンを押すとそのサイトを開くことができます。

使い方は簡単で、NMRのファイル(brukerの1rファイル)を選択するかD&Dするだけです。

これですぐにNMRを見ることができます。

横軸と縦軸の数字がありますが、ここに数字を入れてEnterを押すことでスペクトルの縮尺を調整することができます。

数字を小さくするほどその軸に対してピークは大きくなり、拡大することができます。

ブラウザで動作するため、PCでもスマホでもサイトにアクセスすることができればNMRを簡単に確認することができます。

またサーバーなどを使っていないため、NMRデータはアップロードされず、ブラウザに読み込ませるだけのため安心して使うことができます。

しかしこのサイトには課題が多くあります。

まずこのサイトはbrukerのNMRファイルしか読み取れません。

brukerの1rは読み取れましたが、JEOLのjdfファイルは読み取れませんでした。

さらに軸のメモリはppmではありません。

またスマホからNMRを見る場合、スマホから直接NMRファイルにアクセスできないと見れません。

そのためスマホから開けるクラウドストレージに入れておくか、スマホに保存しておく必要があります。

あとは単純にそんな見やすくないです。

これを作ったきっかけとして、ブラウザでNMRが見れたら便利だと考えました。そこでまず、NMRファイルの中身を適当にプロットすればスペクトルが得られるかなと思い、符号付きで4バイトずつ取り出してプロットしました。

するとNMRスペクトルっぽいものが得られました。

このように勘でNMRを表示しており、その他のメタデータも無視してプロットしています。

RamoやTopspinをリバースエンジニアリングすれば詳しいことがわかるかもしれませんが、そんな技術はないので諦めました。

非常に苦戦したことはjsでバイナリを扱うことでした。

pythonだとchatGPTにコードを書いてもらってコピペするだけですぐにできましたが、jsはうまくいきませんでした。

もう少しうまく説明すればいいコードを作ってくれるのかもしれませんが。

ファイルをArrayBufferとして読み込ませて、その後32ビットずつ取り出してcanvasでプロットしました。

jsなんて全然使ったことなかったので、=>やFileReaderなど何も知らなかったため0から調べました。

あとはこのBloggerで動かすには狭すぎるので、新しいウィンドウで開いて全体を使えるように工夫しました。

疲れたけどまあとりあえず動くものができたのでよかったです。

コードの汚さは知りません。動けばよしっ！！！