21

私は正常に動作する HTML キャンバス要素で基本的な形状を作成しました。

キャンバスのサイズを変更すると問題が発生し、キャンバス内のすべての描画が消えます。これは正常な動作ですか?または、これを停止するために使用できる機能はありますか?

これを修正する 1 つの方法は、キャンバスのサイズ変更時に描画関数を再度呼び出すことですが、描画するコンテンツが非常に大きい場合、これはあまり効率的ではない可能性があります。

最善の方法は何ですか?

サンプルコードへのリンクは次のとおりですhttps://gist.github.com/2983915

4

7 に答える 7

30

サイズを変更するときは、シーンを再描画する必要があります。

キャンバスの幅または高さを以前と同じ値に設定している場合でも、キャンバスをクリアするだけでなく、キャンバス コンテキスト全体をリセットします。設定されたプロパティ ( fillStylelineWidth、クリッピング領域など) もリセットされます。

キャンバスを表すデータ構造からシーンを再描画する機能がない場合は、メモリ内キャンバスに描画し、元の幅を設定し、インメモリ キャンバスを描画することで、いつでもキャンバス全体を保存できます。メモリ キャンバスを元のキャンバスに戻します。

キャンバス ビットマップを保存し、サイズ変更後に元に戻す非常に簡単な例を次に示します。

http://jsfiddle.net/simonsarris/weMbr/

于 2012-06-24T17:51:24.080 に答える
3

キャンバスのサイズを変更するたびに、仕様で定義されているように、キャンバスは透明な黒にリセットされます。

次のいずれかを行う必要があります。

  • キャンバスのサイズを変更するときに再描画する、または、
  • キャンバスのサイズを変更しないでください
于 2012-06-24T17:03:32.507 に答える