Raphael を使用して重労働を行うために、Javascript でインタラクティブなマップを描画しようとしています。
マップの背景は、グリッド、マップ要素、ラベルなどを含むかなり複雑なものです。これに加えて、ユーザーが実際に作業しているものを描画します。背景は複雑なので、フレームごとに再レンダリングする必要はありません。したがって、描画した後、それらの描画要素を再利用したいと思います。ユーザーがパン、ズームなどを行ったときに背景の移動、回転、スケーリングを変更するだけです。
残念ながら、Raphael の変換プリミティブにはかなり混乱しています。を呼び出すscale()と、スケーリングは描画要素の元のサイズに適用されるように見えます。translate()累積的であるため、前の翻訳に適用されます。rotate()私が設定できるオプションがあるので、どちらでもかまいません...
絶対翻訳は可能ですか？つまり、オブジェクト (通常はパス) の新しい中心の絶対座標を指定できるようにするには? それができない場合、古い場所を追跡して、新しい場所に移動したいときにデルタを適用できるようにすることは、これを行うための合理的な方法ですか?
それとも、フレームごとに全体を単純に再レンダリングしたほうがよいのでしょうか? (Raphael は複雑な描画の変換が得意ではないという提案が見られます。そのほとんどは Javascript で行われているためです。生成されている SVG を見ると、変換がパス データに戻されているように見えます。我慢して…）
(ところで、FWIW 私はこれらすべてに GWT Raphael インターフェイスを使用しています。)