JavaScriptに関しての記事
Hands 【Hands/第3回】
今回は手に表示している画像を手の角度に合わせて回転させてみたいと思います。 前回行った画像の表示方法を知っておく必要があるので、覚えていない人は確認しましょう。 確認 ctx.drawImage(Img, canvas.width-(cen...
Hands 【Hands/第2回】
今回は手に画像を表示してみたいと思います。 前回の課題で行った座標の取得が重要になるので、覚えていない人は確認しましょう。 確認 hands.onResults(results => { ctx.clearRect(0, 0, canvas...
Hands 【Hands/第1回】
今回はHandsに触れてみようと思います。 MoveNetと似ている箇所が多いので、安心して取り組んでください。 Handsとは Handsは、手の位置を検出し、各関節のランドマーク（指の位置）をリアルタイムで追跡するための機械学習モデルで...
Hands Handsを知ろう！
全3回でHandsについてを学んでいきます 第1回 第2回 第3回
MoveNet 【MoveNet/第6回】
第6回です。最終回となります。 今までの機能を合体しよう 第3回の後半から第5回にかけて、旗揚げゲームに必要なパーツを制作してきました。 MoveNetで旗を持たせたり、ランダムに旗の出題をするシステムや旗の状態を管理するシステムは作りまし...
MoveNet 【MoveNet/第5回】
第5回です。このあたりから発表用に自分が作るゲームのイメージをしておくといいかも？ キーポイントの座標を取得 前回旗揚げゲームの出題と旗の状態管理について取り扱ったので、今回はMoveNetで手を挙げたかの判定をする仕組みを作ります。 Mo...
MoveNet 【MoveNet/第4回】
ついにMoveNetも第4回、折り返しです。 MoveNetでゲームを作ろう 前回の課題で手に旗を持たせることから察しているかと思いますが、今回は旗揚げゲームを制作していきます。 「赤あげて」「白あげて」「赤さげないで、白さげて」みたいな出...
LINEBOT LINEチャットボット（3択クイズ⑤ユーザID登録）
以下の点に注意してから作業を始めてください！ パソコンで作業をする ブラウザの自動翻訳機能をオフにする 目次 シートの追加 Apps Scriptにプログラミング変更+公開設定更新 １．Apps Scriptを開く ２．プログラムを書き...
MoveNet 【MoveNet/第3回後半戦】
続きです。 コード解説 まず何の関数が定義されているかチェックしましょう。 // 1.MoveNetモデルを読み込む関数 async function loadMoveNet() // 2.ビデオからポーズを推定する関数 async fun...
MoveNet 【MoveNet/第3回前半戦】
第3回ではいよいよMoveNetを組み込む作業を進めます。 前回から2段階程度難易度が上がるので、お覚悟を。といっても、できる限り詳しく解説するので身構える必要はない...ハズ... 外部スクリプトを知る 第2回では、HTMLファイルにJa...