#author("2020-07-08T14:37:59+09:00;2019-08-19T18:54:17+09:00","default:inoue.ko","inoue.ko") #author("2023-12-11T13:12:18+09:00;2019-08-19T18:54:17+09:00","default:inoue.ko","inoue.ko") *TensorFlow.js https://www.tensorflow.org/js/?hl=ja ~ TensorFlow.jsとは、Googleが公開した JavaScript ライブラリで、ブラウザ上で機械学習のモデルの構築、学習、学習済みモデルの実行などを可能にします。 一般に[[機械学習（ML）>MachineLearning]]による推論はサバーサイドで行いますが、これはクライアントサイドで実現します。処理スピードに関しては、ローカルデバイスのGPUに[[WebGL]]を介してアクセスすることで、高速な処理が実現されています。 学習済みモデルをダウンロードする必要があるため、その容量には制約がありますが、後述する MobileNet などコンパクトかつ面白いモデルが存在します。 ~ ***CONTENTS #contents2_1 ~ **はじめに ***概要 TensorFlow.jsでは、以下のようなことが可能です。 -[[既存のモデルを実行する>https://www.tensorflow.org/js/models/?hl=ja]] --画像の分類 --オブジェクトの検出 --人体の部位を分割 --姿勢推定 --コメントが会話に与える影響（有害＜＞無害）のスコアリング -既存のモデルを再トレーニングする --画像分類器を元にした転移学習 --音声認識を元にした転移学習 -JavaScript を使用して ML モデルを開発する ~ ***導入方法 ブラウザベースのプロジェクトで TensorFlow.js を利用するには２つの方法があります。 -scriptタグを使用する -NPMからインストールして、ビルドツールを使用する ここでは、簡単に試せる scriptタグの利用を前提とします。以下のコードをメインのHTMLの<head>部分に記載するだけです。 <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.0/dist/tf.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.3.1/dist/tf.min.js"></script> ~ ~ **サンプルプログラム 以下、MobileNetの学習済みモデルを利用して、画像の対象物を推論するサンプルです。CDNを使用するため、以下のHTMLファイルと適当な画像ファイル（以下の例では、sample.jpg に相当）を一つ用意してお試し下さい。 尚、結果はコンソールに表示されるので、ブラウザの開発ツールでコンソールを表示しておくことが必要です。 &color(red){サーバーにアップしてお試し下さい。}; <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.1/dist/tf.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.3.1/dist/tf.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/mobilenet@1.0.0"> </script> <title>MobileNet｜TensorFlowJS</title> </head> <body style="text-align:center"> <h1>MobileNet｜TensorFlowJS</h1> <img id="image" src="sample.jpg"></img> <script> const img = document.getElementById('image'); // Loading the model. mobilenet.load().then(model => { // Classify the image. model.classify(img).then(predictions => { console.log(predictions); }); }); </script> </body> </html> ~ ~ **デモプログラム 手元の画像のドラッグ＆ドロップで、対象を推論するサンプルです。上位４件の候補を、その確率とともに表示します（人や人物の顔は対象外なので、人物の画像を投入すると「T-シャツ」や「ネクタイ」が検知されます。）。 -CODE：https://github.com/koichi-inoue/TensorFlowJS_MobileNet -DEMO：https://koichi-inoue.github.io/TensorFlowJS_MobileNet/ -WebGL経由でGPUを利用するので、古い環境では動かない場合があります。 -認識できる物体のラベル一覧は以下の検索でヒットします。 [[Google:imagenet 1000 classes list]] ~ ~ **APPENDIX ***TensorFlow.js Examples TensorFlow.jsを使用したMLタスクを実装したコード例 https://github.com/tensorflow/tfjs-examples ~ ***A Neural Network Playground ニューラルネットワークの動きを直感的に可視化する遊び場です。 https://playground.tensorflow.org/ ~ ***関連ページ //-[[BrainScience]] -[[DataScience]] //-[[Data]] //-[[Statistics]] -[[MachineLearning]] -[[NeuralNetwork]] //-[[DataMining]] -[[ArtificialIntelligence]] //-[[ArtificialIntelligence/Links]] ~ ~