ホームページ > ウェブフロントエンド > jsチュートリアル > Matlabと平均スタックでWebアプリを作成する

Matlabと平均スタックでWebアプリを作成する

尊渡假赌尊渡假赌尊渡假赌
リリース: 2025-02-19 13:22:12
オリジナル
745 人が閲覧しました

Creating a Web App with MATLAB and the MEAN Stack

コアポイント

  • テクニカルコンピューティングの高レベル言語であるMATLABは、平均スタックと統合して強力なWebアプリケーションを作成できます。
  • 平均スタックは、mongodb、express.js、angularjs、node.jsで構成されており、Matlabと併用すると、Web上のリアルタイムのデータ視覚化が可能になります。
  • 統合プロセスには、Matlabのコンピューティングパワーを使用してデータを処理して結果を生成します。これは、平均スタックを使用して構築されたWebアプリケーションに表示されます。
  • MATLAB言語での無料のオープンソースJSONエンコーダー/デコーダー実装であるJSonLabは、Webアプリケーションで使用するためにMATLABデータをJSON形式に変換するために使用されます。
  • MATLAB Webアプリケーションの作成には、MATLABコンパイラを使用したスタンドアロンアプリケーションの作成、MATLAB WebアプリサーバーでWebアプリケーションプロジェクトの作成、Webアプリケーションプロジェクトへのスタンドアロンアプリケーションのアップロード、ユーザーへのWebアプリケーションの展開が含まれます。
MATLABは、問題やソリューションをおなじみの数学的表記で表現できる使いやすい環境で、コンピューティング、視覚化、プログラミングを統合する技術コンピューティングの高レベルの言語です。 Matlabで書かれ、何百万人もの科学者とエンジニアによって開発された世界中に多くのプロジェクトがあります。 MATLABから取得したさまざまな実験および運用データを使用して、Webアプリケーションをサポートすることができますが、いくつかの障害があります。

MATLABはマトリックス形式のデータを理解していますが、WebアプリケーションはJSONまたはXML形式でデータを好みます。
  • データは通常、MATLABプログラム内で作成および使用されます。これにより、データの節約と使用などの開発者の自由が制限されます。
  • MATLABがJSON形式でデータを提供し、WebアプリケーションがMATLABからこのJSONデータを使用して素晴らしいものを作成できる場合、アプリケーションの作成ははるかに簡単です。
  • この記事では、MATLABと平均スタックを一緒に動作させる方法を示すための小さなデモプログラムを開発します。
Webアプリケーションについて

このWebアプリケーションには、MATLABからブラウザへのリアルタイムデータ転送が含まれます。簡単にするために、現在の時刻をMATLABから転送し、ブラウザに表示します。 MATLABでJSONファイルをエンコード/デコードするためのツールボックスであるJSonLabを使用します。 Webアプリケーションは、平均スタックを使用して作成されます。平均スタックに慣れていない場合は、継続する前に「平均スタックの初心者」を読むことをお勧めします。

jsonlabの紹介

jsonlabは、matlab言語でのJSONエンコーダー/デコーダーの無料オープンソース実装です。 MATLABデータ構造(配列、構造、セル、構造配列、およびセル配列)をJSON形式の文字列に変換するか、JSONファイルをMATLABデータにデコードするために使用できます。

loadjson()savejson()loadubjson()、およびsaveubjson()の4つの関数へのアクセスを提供します。最後の2つの関数は、UBJSON形式を処理するために使用されます。 loadjson()は、JSON文字列を関連するMATLABオブジェクトに変換するために使用されます。私たちのプロジェクトでは、Matlabオブジェクト(セル、構造、または配列)をJSON文字列に変換するsavejson()関数のみを使用します。次のように使用できます

json = savejson(rootname, obj, filename)
json = savejson(rootname, obj, opt)
json = savejson(rootname, obj, 'param1', value1, 'param2', value2, ...)
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ファイルを記述する必要があるため、最初の署名を使用します。 JSON文字列を返し、文字列をファイルに書き込みます。

jsonlabのインストール

開始するには、jsonlabをダウンロードし、アーカイブを解凍し、次のコマンドを使用してMATLABのパスリストにフォルダーのパスを追加します。

このパスを永続的に追加する場合は、

と入力し、jsonlabルートフォルダーを参照してリストに追加する必要があります。終了したら、[保存]をクリックする必要があります。次に、matlabで
addpath('/path/to/jsonlab');
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
を実行して

を実行します。出力が表示された場合、JsonLabが正しくインストールされていることを意味します。 pathtool rehashwhich loadjsonmatlab code

現在の時刻が必要なので、コマンドを使用します。 [年、月、日、時間、秒]の形式で現在の日付と時刻を含む6要素の日付ベクトルを返します。繰り返し時間を取得するために、

コマンドを無限の

ループに配置します。したがって、MATLABコマンドウィンドウでCTRL Cを使用してスクリプトの実行が終了するまで、リアルタイムデータを取得し続けます。 clock clock次のコードは、このアイデアを実装しています:while

プロジェクトでは、営業時間、分、秒に焦点を当てています。上記のコードで使用されている

関数は、マトリックスのすべての要素を最も近い整数に丸めます。時間データを取得するには、マトリックスの列4の値が必要なため、コマンド
format shortg;
y=0;
while y == 0
    % c = [year month day hour minute seconds]
    c=clock;
    % 将每个值四舍五入为整数
    c=fix(c);
    x.clock=c;
    % 访问c的第4列,即小时
    x.hours=c(:,4);
    % 访问c的第5列,即分钟
    x.minutes=c(:,5);
    % 访问c的第6列,即秒
    x.seconds=c(:,6);
    % 将x转换为JSON并写入matlabData.json
    savejson('',x,'data/matlabData.json');
end
ログイン後にコピー
ログイン後にコピー
を使用します。同じ方法を使用して、分と秒を取得します。

fix(c)クロックといくつかの個別の変数をWebアプリケーションに個別に送信して、MATLABオブジェクトからJSONへの異なるデータ型の変換を表示します。クロックデータは配列に変換されますが、時間、分、秒の値は数値に変換され、後で表示されます。 c(:,4) 私たちのプロジェクトでは、JSON形式を使用して変数xを変換および書き込み、ファイルに書き込みます

に書き込みます。簡単にするために、

パラメーターは空の文字列になります。

前のコードを使用して、必要なすべてのMATLABコードを完了します。これで、スクリプトを実行すると、JSONファイルがデータフォルダーに作成され、ファイル内のデータが自動的かつ絶えず更新されることを観察できます。 JSONファイルコンテンツの例は次のとおりです savejson() matlabData.jsonこのファイルを監視し、node.jsを使用して最新のデータを読み取ります。それでは、Webアプリケーションの構築を開始しましょう。 rootname

webアプリケーション

{
   "hours": 19,
   "minutes": 28,
   "seconds": 28,
   "clock": [2015,5,27,19,28,28]
}
ログイン後にコピー

MATLABデータがJSONに変換され、ファイルに保存されたため、このファイルを独立して読み取り、変更を監視してデータを取得できます。この操作は、MATLABとは何の関係もありません。この記事の残りの部分では、基本的な概念の一部のみを使用していても、socket.ioと平均スタックを理解していると思います。

Webアプリケーションの作成を開始しましょう。

package.jsonファイルを作成

アプリケーションを開始するには、プロジェクトの依存関係を定義しましょう。これを行うには、次のようにpackage.jsonファイルを作成します。

json = savejson(rootname, obj, filename)
json = savejson(rootname, obj, opt)
json = savejson(rootname, obj, 'param1', value1, 'param2', value2, ...)
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ファイルを作成した後、プロジェクトのルートフォルダーで

を実行して、すべての依存関係をインストールします。 NPMに慣れていない場合は、「NPM Getting Guide -Node Package Manager」を読むことをお勧めします。 npm install

サーバーサイドコード コードのこの部分には、node.js、Express、およびMongodbの使用が含まれます。サーバーによって実行される操作には、

が含まれます

提供
    file
  • index.html jsonファイルのデータを監視および読み取り
  • mongodb
  • を使用してデータベースにデータを保存します
  • socket.io
  • を使用してブラウザにデータを送信します
  • ルートフォルダーに
という名前のファイルを作成し、説明されているすべての機能に必要なコードを記述します。

server.js Expressを使用して静的ファイルを提供します:

要求が
addpath('/path/to/jsonlab');
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
に送信されるたびに、

ディレクトリに保存されているファイルが提供されます。 / appファイルへの変更を監視するには、index.htmlを使用し、ファイルが変更されるたびに読み取るには、

を使用します。変更が検出されると、ファイルが読み取られ、データが取得されます。プロセス全体が次のコードを使用して完了します。

fs.watch()クライアントとの接続が確立され、データの取得を開始すると、2つのことが行われます。 fs.readFile() functionを使用して、データをブラウザに送信します

format shortg;
y=0;
while y == 0
    % c = [year month day hour minute seconds]
    c=clock;
    % 将每个值四舍五入为整数
    c=fix(c);
    x.clock=c;
    % 访问c的第4列,即小时
    x.hours=c(:,4);
    % 访问c的第5列,即分钟
    x.minutes=c(:,5);
    % 访问c的第6列,即秒
    x.seconds=c(:,6);
    % 将x转换为JSON并写入matlabData.json
    savejson('',x,'data/matlabData.json');
end
ログイン後にコピー
ログイン後にコピー

Mongooseミドルウェアを使用してMongoDBにデータを保存します<」

2番目の操作を実行するには、データのスキーマを作成し、そのスキーマに基づいてモデルを作成します。これは、以下に示すコードを使用して行われます:
  1. 前のコードセグメントの最後のステートメントでは、定義されたパターンに基づいてモデルを作成します。関数に渡された最初のパラメーターは、モデルが属するセットの単数名です。 Mongooseは、複数の名前をコレクションに自動的に割り当てます。したがって、ここではemit()
  2. コレクションのモデルです。
  3. 新しいデータを取得すると、最新のデータを使用してスキーマの新しいインスタンスを作成し、
メソッドを使用してデータベースに保存します。このインスタンスはドキュメントと呼ばれます。次のコードでは、

はドキュメントです。

この部分の最終コードは次のとおりです。
json = savejson(rootname, obj, filename)
json = savejson(rootname, obj, opt)
json = savejson(rootname, obj, 'param1', value1, 'param2', value2, ...)
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

tryおよびcatchを使用して、アプリケーションのクラッシュを防ぎます。使用しないと、JSON.parseが急速な変更により予期しないユーザー入力エラーを引き起こした場合、アプリケーションがクラッシュする場合があります。これは私たちが避けたいものです!

また、MongoDBサーバーが実行されていることを確認してください。そうしないと、アプリケーションがクラッシュします。

クライアントコード

このセクションでは、単純な静的HTMLページを作成します。 socket.ioを介して新しいデータが受信されると、ページに表示されるデータを更新します。このデータは、リアルタイムチャートの作成にも使用できます。

以下は、

ファイルの単純なコードです:index.html

addpath('/path/to/jsonlab');
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

ディレクティブは、アプリケーションがロードされているときに、ブラウザが元の(コンパイルされていない)AngularJSテンプレートを簡単に表示しないようにするために使用されます。 ngCloak

アプリケーションを実行します

node.jsサーバーを起動する前に、MatlabコードとMongoDBサーバーが実行されていることを確認する必要があります。 MongoDBサーバーを実行するには、端末でコマンド

を実行する必要があります。 node.jsサーバーを実行するには、プロジェクトフォルダーのルートディレクトリでコマンドmongodを実行する必要があります。 node server.js

現在の時刻を示す静的ページは

で提供されます。 127.0.0.1:3000

結論 この記事では、平均スタックを使用して、MATLABプログラムからJSON形式のデータを取得するWebアプリケーションを作成します。データはJSonLabの助けを借りて変換されます。データはsocket.ioを使用してブラウザに送信されるため、ブラウザの変更はリアルタイムで反映されます。このデモの完全なソースコードは、GitHubで入手できます。

この記事を楽しんで、コメントを読むことを楽しみにしています。

(FAQSセクションは、記事の長さのために個別に処理するようにお勧めします。重要な質問と回答を抽出し、必要に応じて簡単に要約または再編成できます。

以上がMatlabと平均スタックでWebアプリを作成するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート