イナヅマTVログ

Canvas始めました – Canvasの幅と高さは属性で指定しましょうね

| 0件のコメント

canvasの幅と高さの指定する話。

windowいっぱいに全面にcannvasを表示させたい時、CSSで width: 100%; と指定すると楽だと思ったら、scaleがかかって変形されてしまいました。

<canvas style="width:100%;"></canvas>

このような指定のcanvasに描画される矩形は変形(スケール)してしまいます。
不思議な感じだけどなんかtableのような振る舞いなんかなぁ。

JavaScriptでwindow.resizeを監視して幅と高さをcanvasのwidth, height属性(attributes)に指定しないといけません。
しょうがない、ちゃんとJS書いておきましょ。

【教訓】
canvasのサイズをCSSで指定してはいけない

コメントを残す

必須欄は * がついています