[HTML5] Canvasに画像を貼り付ける - ねこの足跡R

HTML5のCanvas上に絵を描画することが可能ですが、さすがにすべてをプログラムで描画するのは現実的ではありません。というわけで今回はJPEGやPNGなどの画像を貼り付ける方法になります。 今回は「ゆるドラシル」のアセットを利用させていただきました。 yurudora.com 画像を貼り付ける シンプル版 サンプルコード 実行例 元画像を縮小・拡大してから貼り付ける サンプルコード 実行例 元画像の一部分を切り抜いて貼り付ける サンプルコード 実行例 素材 参考ページ 画像を貼り付ける シンプル版 何も考えずにJPEGやPNG、WebPなどブラウザが解釈できる画像をCanvasに貼り付けるだけらな、ctx.drawImage()メソッドを実行するだけです。 ctx.drawImage(image, dx, dy) image Image, Canvas, Videoのいずれかの要素(オ