JavaScript11行で画像オブジェクト認識を実装して「AIつかってるサービスです」って爆速でドヤる方法

JavaScript11行で画像オブジェクト認識を実装して「AIつかってるサービスです」って爆速でドヤる方法:

たった11行です。

結論から言うと、

もうこれだけです。

index.html
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script> 
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/coco-ssd"></script> 
<script> 
    const img = new Image(); 
    img.src = './cat.jpg'; 
    cocoSsd.load().then(model => { 
        model.detect(img).then(predictions => { 
            console.log('Predictions: ', predictions); 
        }); 
    }); 
</script> 
index.html というファイルを作成して

↑のコードをコピペ

適当な猫の画像を落としてきて

同じディレクトリに cat.jpg と保存

今回はクリスマス猫を使用

そのディレクトリで以下のコマンドを実行します。

$ python -m SimpleHTTPServer 3000

起動方法はなんでもOKです。

  • $ php -S 127.0.0.1:3000
  • $ npm install -g http-server && http-server -p 3000
etc

ref: https://gist.github.com/willurd/5720255

実行後、

=> http://localhost:3000/

へアクセスしてコンソールを見れば

Screen Shot 0030-12-21 at 6.03.46 PM.png

といった具合に画像の中にあるオブジェクト認識が実行されているのがわかります。


少しだけ解説

今回は、coco-ssd というオープンソースのオブジェクト認識モデルを使用しています。

=> https://github.com/tensorflow/tfjs-models/tree/master/coco-ssd

↑のGitHubにもある通り

NPM経由でも使用することができます

import * as cocoSsd from '@tensorflow-models/coco-ssd'; 
const img = new Image(); 
img.src = './cat.jpg'; 
const model = await cocoSsd.load(); 
const predictions = await model.detect(img); 
console.log(predictions); 
こっちだと6行ですね←

こちらを用いることで

人間(person)や自転車(bicycle),車(car)などなど

90種類のオブジェクト認識を実行することができます。

=> https://github.com/tensorflow/tfjs-models/blob/master/coco-ssd/src/classes.ts


アメリカでは実に2/3のアプリが機械学習を取り入れている

近年、 "AIが〇〇しています" というサービスが増えてきましたが

アメリカでは実に2/3のアプリが機械学習を取り入れているとの結果がアンケートで出ているそうです。



Screen Shot 0030-12-21 at 6.20.23 PM.png


ref: https://twitter.com/yabaiwebyasan/status/1073417541618286592

(Google Developers ML Summitで聞いた話なのでソースのリンクなどはありませんがw)

機械学習はTensorFlowが2015年にオープンソースになって以来、

学習済みモデルがオープンソース上に転がっていたりするなど

どんどんサービスに組み込むハードルが下がってきています。

もはや、 "AIが〇〇しています" でどやれるような時代ではなくなってきてます。

まだAIやってないの?

の時代なのです

とはいえ、日本ではまだまだ機械学習はハードル高くて無理だなぁと思っているディベロッパーは多いはず。

是非、これを機に機械学習をサービスに取り入れてみてはいかがでしょう

こんな勉強会もやりますので

よければご参加ください。



Screen Shot 0030-12-21 at 6.23.55 PM.png


ref: https://twitter.com/yabaiwebyasan/status/1075409847401603072

以前の勉強会資料もシェアしておきます。

=> 文系で数学ができなくてもお手軽に試せる機械学習ツール

コメント

このブログの人気の投稿

投稿時間:2021-06-17 05:05:34 RSSフィード2021-06-17 05:00 分まとめ(1274件)

投稿時間:2021-06-20 02:06:12 RSSフィード2021-06-20 02:00 分まとめ(3871件)

投稿時間:2020-12-01 09:41:49 RSSフィード2020-12-01 09:00 分まとめ(69件)