解説

Canvasの大きさを変更する方法には、タグ属性で修正する方法と、CSSで修正する方法の2つが存在する。
しかし、CSSで修正を行うと、注意事項にもある通り、画像として扱われるため、純粋にCanvasサイズのみを変更することができない。
ここでは、純粋にCanvasサイズのみを変更する方法を示す。
更新日:2017年2月8日

サンプル・コード

下記のサンプルでは、JavaScriptとjQueryでの指定方法の2つを示している。
変更サイズは、例として横幅も高さも「200px」と仮定している。
jQueryでの記述


$('#sample_canvas').width( 200 );
$('#sample_canvas').height( 200 );

JavaScriptでの記述


var elem = document.getElementById('sample_canvas');
elem.setAttribute( 'width', '200px' );
elem.setAttribute( 'height', '200px' );

注意事項

更新履歴

2017/02/05 … 浅野 利博
新規作成

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.