なぜ私のHTML5キャンバスはそれより小さくレンダリングされますか？

私はcanvasの要素と描画でうんざりしています。単純な四角形は、必要なピクセル数よりも少ないレンダリング数です。なぜ、最新のFirefox、Safari、Mobile Safariのブラウザで起こるのか分かりません。私はこれがキャンバス全体を埋めると期待しています。なぜ私のHTML5キャンバスはそれより小さくレンダリングされますか？

screenshot

<html> 
<body> 
<canvas id="draw" style="width:100px;height:100px;border:1px solid #f00;" 
onClick="doDraw(event)"> 
</canvas> 
<script> 
function doDraw(ev) { 
    console.log(ev.clientX,ev.clientY); 
    var el = document.getElementById('draw'); 
    var ctx = el.getContext('2d'); 

    ctx.fillRect(0,0,100,100); 
} 
</script> 
</body> 
</html>

出典

2012-03-02 Matt H

<canvas id="draw" style="width:100px;height:100px;border:1px solid #f00;" 
onClick="doDraw(event)">

<canvas id="draw" width="100" height="100" style="border:1px solid #f00;" 
onClick="doDraw(event)">

にする必要がありますが、コンテナではなく、コンテナのスタイルを変更しています。それが意味をなさないならば。

出典

2012-03-02 22:36:13

Yeesh、いつも私はいつもスタイル属性を使用するのに慣れていた...ありがとう –

なぜ私のHTML5キャンバスはそれより小さくレンダリングされますか？

答えて

関連する問題