サルでもわかるWEBプログラミング

フリーソフトのみでホームページ作成

現在位置: index.html » tensorflow.js » 01._ml5.js

トレース:

tensorflow.js:01._ml5.js

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

--- tensorflow.js:01._ml5.js [2020/12/27] – [その他] adash333
+++ tensorflow.js:01._ml5.js [2021/02/02] – [コーディング] adash333
@@ 行 3: / 行 3: @@
 ml5.jsは、機械学習の訓練済みモデルを簡単に利用できるJavaScriptライブラリです。TensorFlow.jsが元になっているらしいです。
+ml5.jsを用いて、画像分類をやってみたいと思います。
+===== 開発環境 =====
+<code>
+Windows10
+Chrome
+</code>
+===== CodeSandbox上でml5.jsを用いて画像分類 =====
+  -CodeSandboxで新規JavaScriptアプリを作成
+  -cat.jpgを用意してCodeSandboxにアップロード
+  -コーディング
+==== CodeSandboxで新規JavaScriptアプリを作成 ====
+https://codesandbox.io/ で、新規JavaScriptアプリを作成
+{{:tensorflow.js:pasted:20210202-071300.png}}
+GitHubアカウントなどでサインインします。
+{{:tensorflow.js:pasted:20210202-071521.png}}
+GitHubアカウントのＩＤとパスワードを入力したのち、新規SandBoxを作成
+{{:tensorflow.js:pasted:20210202-071704.png}}
+Vanilla(通常のJavaScript)を選択します。
+{{:tensorflow.js:pasted:20210202-072030.png}}
+以下のようになります。
+{{:tensorflow.js:pasted:20210202-072237.png}}
+==== cat.jpgを用意してCodeSandboxにアップロード ====
+https://www.pakutaso.com/20191230358post-24834.html　から猫の写真をダウンロードして、cat.jpgという名前で保存します。
+{{:tensorflow.js:pasted:20210202-072827.png}}
+src　のすぐ右側にマウスを持っていき、『↑』をクリックします。
+{{:tensorflow.js:pasted:20210202-072938.png}}
+先ほどの、cat.jpg　を選択してアップロードします。
+{{:tensorflow.js:pasted:20210202-073039.png}}
+これで、cat.jpgがsrc/　フォルダにアップロードされました。
+{{:tensorflow.js:pasted:20210202-073122.png}}
+==== コーディング ====
+index.html　を以下のように変更します。
+<code>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>Getting Started with ml5.js</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <script src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>
+  </head>
+  <body>
+    <div id="app"></div>
+    <img id="img" width="100%" src="src/cat.jpg" />
+    <script src="src/index.js"></script>
+  </body>
+</html>
+</code>
+{{:tensorflow.js:pasted:20210202-074359.png}}
+src/index.js　を以下のように変更します。
+<code>
+</code>
@@ 行 32: / 行 94: @@
 Google製「Teachable Machine」の機械学習で簡単に音声認識データを作る ～TensorFlowの技術を「Scratch」で活用
 狩野 さやか2020年8月20日 06:55
+https://forest.watch.impress.co.jp/docs/serial/progedu/1273286.html
+「Teachable Machine」で機械学習した音声認識データを使って「Scratch」でプログラミング ～拡張機能「TM2Scratch」を専用の「Scratch」で
+狩野 さやか2020年8月27日 14:49

tensorflow.js/01._ml5.js.txt · 最終更新: 2021/02/02 by adash333