const SW = window.innerWidth; const SH = window.screen.height; let can = document.getElementById("can"); let ctx = can.getContext("2d"); const img01 = new Image(); img01.src = "./b6b85a3281f5512d95f18c07ec0f6e52_l.jpg"; img01.onload = function() { ctx.drawImage(img01,0,0,SW,SH); } ctx.fillStyle; ctx.fillRect(0, 0, 100, 100);
タイトルの通りになりますが、canvasで指定した画像の上に描画したいです。
今のままではfillRectで描画した黒の四角形が写真の下に描画されます。
やり方をご存知であればご教授頂きたいです。
宜しくお願いします。
現在のコードにおける問題点は何でしょうか
https://teratail.com/help/question-tips#questionTips3-4
何が問題・課題・分からないのか詳しく書いてください。
> canvasで指定した画像の上に描画したい
何を描画するのでしょうか?
手書きでいいのでサンプルを画像で例示できませんか?
修正の依頼ありがとうございました。
修正させていただきました。また何か分からないことがありましたら、その都度修正させていただきます。
> 写真の上に黒の四角形を描画したいです。
アップされていた画像を見るとそれはできているようですけど・・・ それがやりたいことと違うとすると一体何がしたいのですか?
すみません、こちらの写真はこのようにしたいという意味です
今どうなっているかも写真を上げると回答つきやすいですよ。
回答1件
あなたの回答
tips
プレビュー