2012-01-12 14 views

答えて

1

ブラウザのソースコードを見るのは、少ししか分かりませんが、私は知る方法はないと思います。 (彼らがいるかのようにまたはACT)

形状や画像がペイントされ

、ユーザエージェントは、与えられた順序で を次の手順を実行しなければなりません:

形状をレンダリングまたはThe specは私達に1つのヒントを与えません無限透明ブラックビットマップ

注ワードを「無限」に画像。したがって、仕様では、ブラウザがキャンバスの範囲を超えているものをレンダリングする必要があることが示唆されています。しかし、私が推測しなければならないのは、ほとんどのブラウザが現在のクリッピング領域の外側にあることに気付き、コールをドロップすることです。キャンバスの範囲を超えて何かをレンダリングしてビューに「スクロール」する方法はありません。キャンバスにはその概念がありません。

0

実際にはブラウザや描画コマンドによって異なります。

IE9は、最大wisenedしており、画像をキャンバス範囲外にある場合のdrawImageには-opは呼び出していないん。これはIE9のパフォーマンスプロファイラでは目立ちます。

これは、変換マトリックスが、私はそうでない場合はチェックしていない、アイデンティティである場合にのみ行われる最適化のかもしれません。

他のブラウザはもちろん違いがあります。

1

私は2つのキャンバスを使用して、このデモhttp://jsbin.com/okoful/edit#javascript,html,liveを作成して、私たちは、キャンバスの外に描く場合、それはそれをレンダリングしないだろうと結論付けました。

var canvas1 = document.getElementById('canvas1'); 
var ctx1 = canvas1.getContext('2d'); 
ctx1.fillRect(50, 50, 300, 300); 
var canvas2 = document.getElementById('canvas2'); 
var ctx2 = canvas2.getContext('2d'); 
ctx2.translate(0,0); 
ctx2.drawImage(ctx1.canvas,0,0); 

$( "#debug")。text( "Output:");

関連する問題