htmlのcanvasタグには大きさを指定するものが二つある。一つは画面に表示する、見た目の大きさで、もう一つはカンバス自体の大きさである。カンバス自体の大きさとは、「油絵で人物画を描くとき、0号（180mm×140mm）、1号（220mm×160mm）、2号（240mm×190mm）のどの大きさのものを使うか」ということである。

見た目の大きさは他のタグと同様にcssのwidthとheightで指定する。では、カンバスの大きさ自体をどのように指定するのか。

カンバスの大きさの指定方法

カンバスの大きさはcanvasタグのwidthとheightで指定する。これらは

• body内でcanvasタグを定義するときに指定する
• JavaScriptで指定する

の二種類がある。指定するのはピクセル単位の大きさのみで、単位（px）は付けない。

canvasタグの定義時に指定する方法

canvasタグ内で幅をwidthで、高さをheightで指定する。

<canvas class="canvas" id="canvasA" width="1280" height="720"></canvas>

JavaScriptで指定する方法

JavaScriptではcanvasタグの属性であるwidthやheightの値を指定する。指定方法は二つあり、一つはsetAttribute()で指定する。

let cvs = document.getElementById("canvasA");
//カンバスの描画サイズの定義
cvs.setAttribute("width" ,"1280");
cvs.setAttribute("height" ,"720");

もう一つは「.」で属性を指定する。

let cvs = document.getElementById("canvasA");
//カンバスの描画サイズの定義
cvs.width = 1280;
cvs.heighth = 720;

カンバスの大きさを指定しないとき

canvasタグを定義して大きさを指定しないときのカンバスの大きさの初期値は

• width:300px
• height:150px

になる。

出典：e画材.com キャンバスサイズ一覧表