大きいサイズのHTML5キャンバスが描いた線を引き伸ばすのはなぜですか？

Question

HTML5 <canvas>を使用して線を描いています。

ディメンションをデフォルトの300x150から別の<div>のディメンションに一致するように変更すると、私の線が伸びて見え、以前よりも太くなります。なぜこうなった？

キャンバス上の線を描画して、その前にある<div>の要素の位置（高さはz-index）をページの同じ位置に合わせたいとします。このストレッチが起こらないようにするにはどうすればいいですか？

編集：これはFirefoxでのみ表示されます。

Answer 1

CSSでキャンバスサイズを変更することはできません。あなたはイメージのように振る舞い、ストレッチします。キャンバスのプロパティでキャンバスのプロパティcanvas.width、canvas.heightでそれを行う必要があります。