ブラウザ上で JavaScript を用いた機械学習を行う際、ライブラリの選択肢の 1つである「ml5.js」に関する記事です。
●ml5.js | Friendly Machine Learning for the Web
https://ml5js.org/
ml5.js のサイトがリニューアルされていたのですが、その新サイトの動線に関する情報を書いてみた、という内容です。
ml5.js の新バージョンなど
今年 ml5.js のサイトが新しくなったり、また、大きな変更を伴うライブラリのバージョンアップの情報が出ています。
以下は、公式の X のアカウントでのサイトリニューアルのポストで、新バージョンの話も書いてあります。
また以下の公式のポストでは、CDN からライブラリを読みこんでいる場合での、そのライブラリを旧バージョンから新バージョンに切り替えるための話が書かれています。
旧バージョンのサイトへの動線
現状、新サイトを開いて進むと、右下のほうに、旧バージョンのサイトへの動線が表示されるようになっています。
以下が旧バージョンのサイトです。
この旧バージョンのサイトには、新バージョンのサイトへの動線も用意されています。
新旧バージョンのそれぞれで扱えるモデル
新バージョンになってから、旧バージョンで扱えていたモデルの一部は、使えなくなっています。
それについて、FAQ のページを見ていくと、「Can I still access the older releases of the ml5.js, website and documentation?」という項目で触れられています。
具体的な箇所は、以下のとおりです。
テキストにしたものは以下です。
新バージョンで使えるものとして書いてある項目の中にも、スターテタスがいくつかあるようです。
例えば、「現在は新バージョン対応前で当面は旧バージョンを利用する」となっているものや、「既に利用できて、機能がアップデートされているもの」、「旧バージョンと同じ機能を提供しているもの」などがあるようです。
- 新バージョンでも使えるもの
- FeatureExtractor - coming back soon! (use 0.12.2 for now)
- ObjectDetection - coming back soon! (use 0.12.2 for now)
- PoseNet - Updated! (now BodyPose)
- BodyPix - Updated! (now BodySegmentation)
- HandPose - Updated! Still HandPose!
- FaceMesh - Updated! Still FaceMesh!
- FaceApi - Deprecated, use FaceMesh instead!
- UNet - Deprecated, use BodySegmentation instead!
- Image Classification - the same!
- Sound Classification - the same!
- Sentiment Analysis - the same!
- Neural Network – mostly the same, updates for neuroevolution!
- 新バージョンでは使えないもの
- KNNClassifer - coming soon?
- kmeans - coming soon?
- StyleTransfer
- pix2pix
- CVAE
- DCGan
- SketchRNN
- PitchDetection
- CharRNN
- Word2Vec
「coming soon?」となっているものは、新バージョンに移行するか検討中、といった感じでしょうか。
新バージョンを簡単に体験する
あとは、新バージョンのサンプルを簡単に体験できる部分を紹介してみます。
トップページから次に進んだページの左メニューで、試しに「HandPose」を選んでみてください。
そして、ページを下へ進んでいくと、「Quick Start」という部分と、その下に再生ボタンが表示されたところがあります。
試す場合、この再生ボタンを押して、その後に表示されるカメラ利用の許可を承諾する操作をすれば OK です。
その後にカメラに手をかざすと、両手の特定の箇所を検出し、そこに緑色の点が描画されます。
コードを確認する
そして、実装内容を確認したい場合、それを簡単に行うことができます。
以下の「Open in p5.js Web Editor」と書かれた部分を選んでみてください。
そうすることで、先ほど体験したデモのソースを確認することができます。
●p5.js Web Editor | handPose-keypoints
https://editor.p5js.org/ml5/sketches/QGH3dwJ1A
なお、この p5.js Web Editor でも、処理を実行してデモを体験することができます。
他にも、左メニューの「ml5 Models」という項目の下に、色々なモデルが記載されています。これらの中にも、上記と同様に簡単に試せるものがあるので、ページを開いてみて「Quick Start」の部分をぜひ見てみてください。
例えば「BodyPose」や「FaceMesh」は、上記の「HandPose」と同様に、カメラ入力を使ったリアルタイムなデモを体験できます。