canvasにおけるcanvas自体の大きさに干渉しない画像の大きさの変更

前提・実現したいこと

sublime text でプログラムを組んでいるのですがcanvasに画像を読み込んだ際にcanvasそのものの大きさを変更することなく画像の大きさを変更する方法が知りたいです。
（複数の画像を１つのcanvasに描写して最終的に１つの画像として保存するため）

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード

試したこと

複数のサイトにて調べましたがcanvasごと大きさを変えるものばかりで探すことができませんでした

補足情報（FW/ツールのバージョンなど）

Version: Build 3211

int32_t

2021/10/27 23:08

何のプログラミング言語のcanvasの話でしょうか?

Saienn877

2021/11/01 20:34

説明足らずですみません JavaScriptのことでした

行動規範の内容に同意します

回答1件

JavaScriptのCanvasの話であれば、CanvasRenderingContext2D.drawImage()で画像の大きさを指定するとCanvas自体の大きさは変わらず画像のみを拡大縮小して描画することができます。

CanvasRenderingContext2D.drawImage() -Web APIs | MDN

js
1/* Canvas の x=0, y=0 の位置に 500x500 の大きさに縮小または拡大した画像を描画 */
2context.drawImage(image, 0, 0, 500, 500);
3
4/* Canvas の x=0, y=0 の位置に元のサイズの 1.5 倍にした画像を描画 */
5const scale = 1.5;
6context.drawImage(image, 0, 0, image.width * scale, image.height * scale);