する質問をすることでしか得られない、回答やアドバイスがある。12前提・実現したいことjavascriptを使用して動画をリアルタイムに処理できるようなものを作りたいと考えています。対象のCanvasを取得し、contextも取得する。Canvasから描画内容を保持するimageDataを取得する。描画内容に対して、上記のグレースケールにする式を当てはめながらrgbの値を計算する。計算結果でCanvasの表示内容を更新する。*/}試したことwebサーバを作らないと難しいということは分かったのですが作り方がわからず苦戦しています。エラーメッセージについても調べてみたのですが解決策がわからず苦戦しています。解決策を教えていただけると幸いです。補足情報(言語/FW/ツール等のバージョンなど)より詳細な情報attachmentクリップ0気になる質問をクリップするクリップした質問は、後からいつでもマイページで確認できます。クリップした質問に回答があった際、通知やメールを受け取ることができます。自分も答えを知りたい質問者以外のユーザにも役立つ評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。質問の評価を上げたことを取り消します低評価-評価を下げられる数の上限に達しました評価を下げることができません1日5回まで評価を下げられます1日に1ユーザに対して2回まで評価を下げられます質問の評価を下げるteratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。コメントをしてください。送信する質問の評価を下げる機能の利用条件この機能を利用するためには、以下の事項を行う必要があります。件sort評価が高い順sort新着順sort古い順linkcheckベストアンサー+1document.querySelector("c")では<c>というタグを探していることになります。正しくはdocument.querySelector("#c")またはdocument.getElementById("c")です。他の部分の動作はわかりませんが、今提示されているエラーはこれで消えるはずです。追記ローカルのHTMLファイルを直接開いてcross-originでハマっているようなので解決法を貼っておきます。Chromeの起動オプションに–allow-file-access-from-filesをつけることでローカルの実行でもcross-origin問題を解決できるようです。評価が高い回答ほどページの上位に表示されます。remove低評価0回答の評価を下げる下記のような回答は推奨されていません。評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。18:00ありがとうございます。上記のエラーメッセージは解決しました。直してやってみたところ以下のようなエラーが出ました。HTMLButtonElement.onclick調べてみたのですが、いまいちよくわかりませんでした。このエラーの解決策はありますか?何度も質問してしまい申し訳ございません。ありがとうございます。上記のエラーメッセージは解決しました。直してやってみたところ以下のようなエラーが出ました。調べてみたのですが、いまいちよくわかりませんでした。何度も質問してしまい申し訳ございません。data、つまり「自分のサイトのものではないデータ」が含まれているから「権利的にgetImageDataすることは許さん」というエラーだと思います。movie.mp4というデータは本当は外部の動画ファイルではありませんか?もしくは今このHTMLはブラウザにHTMLファイルを直接読み込ませて表示していませんか?ローカルでの実行の場合も同様のエラーが起きます。data、つまり「自分のサイトのものではないデータ」が含まれているから「権利的にgetImageDataすることは許さん」というエラーだと思います。movie.mp4というデータは本当は外部の動画ファイルではありませんか?もしくは今このHTMLはブラウザにHTMLファイルを直接読み込ませて表示していませんか?ローカルでの実行の場合も同様のエラーが起きます。Chromeに直接ドラッグ&ドロップをしています。動画は他のサイトからダウンロードしたものを使用しています。Chromeに直接ドラッグ&ドロップをしています。動画は他のサイトからダウンロードしたものを使用しています。14:36追記しました。追記したサイトの説明を見ながら試してみてください。私は試していないのでこれで直る保証もないですが、おそらく現象から推測するにこれで直ります。追記したサイトの説明を見ながら試してみてください。私は試していないのでこれで直る保証もないですが、おそらく現象から推測するにこれで直ります。18:37ありがとうございます。ありがとうございます。1webカメラの映像とcanvasを重ねてを全画面で表示したい。頂いたご意見への回答は行っておりません。