javascript - キャンバスとウィンドウのピクセルを比較

Question

私は現在問題を抱えています。html5 と javascript でキャンバスとイメージ オブジェクトを使用して画像を描画したい キャンバス ピクセルとウィンドウ ピクセルの等しいサイズを知りたい 例: たとえば、キャバス (700 * 400) がある場合、サイズを知りたいウィンドウ画面で必要です。したがって、(1*1) を知りたい場合は、window.screen.width * window.screen.height と同じです。

Answer 1

デフォルトでは、キャバンの1pxはウィンドウの1pxに等しくなります。

この場合、canvasは要素のように動作します。独自の幅と高さがありますが、cssを使用してさまざまなサイズに拡大縮小できます。

Answer 2

要素の実際のサイズを、プロパティで定義したサイズで割ります。例: http://jsfiddle.net/pjdmN/

var canvas = document.getElementById('canvas');
var xRatio = canvas.offsetWidth / canvas.width;
var yRatio = canvas.offsetHeight / canvas.height;