3

Paper.path()シンプルなテクスチャで満たされた Raphael があります。

var fill = screen.path(Iso.topFacePath(top)).attr({
  fill: 'url(http://www.example.com/mytexture.jpg)',
});

パスは、ユーザーがドラッグ アンド ドロップで変更できます。このためElement.drag()に、ハンドラーをバインドするために使用します。

私が今直面している問題は、onmove-handler 関数が呼び出されている間に、問題の要素が再計算され、再度描画する必要があることです。どうやらこれは raphael にとって「多すぎる」ため、塗りつぶしパターンがランダムに消え (ちらつき)、しばらくしてから (遅くともonend) 再び表示されます。

私が使用する実際のコードは、ここに投稿するには多すぎますが、何が起こっているかを確認できるフィドルを作成しました (四角形の上部をドラッグできます)。

これに対する簡単な修正はありますか?

私はラファエルよりもはるかにキャンバスに慣れています(実際、ラファエルを実際に使用するのはこれが初めてです)ので、sthが変更されるたびにすべてを再描画するという私のアプローチは明らかに間違っていますか?

編集:ブラウザに関連しているように見えることがわかりました。Chrome と Firefox ではちらつきが発生し、Safari では問題なく動作しているように見えます。

4

1 に答える 1

2

これはキャッシュの問題のようです (raphael.js はビットマップ フィルをキャッシュせ、変更のたびに再読み込みします)、 (2012 年 8 月 14 日現在) まだ保留中のGitHub のこのプル リクエストによって (私にとっては) 修正されています。 .

ラファエルは、メイクファイルがローカルまたは存在しないファイルを指しているため、自分でビルドするのはかなり難しい/不可能ですが、すべてを手動で連結するか、ビルドスクリプトを変更するか、例で使用されている変更されたビルドを使用して取得することができます修正。

それが Raphael の将来のリリースに組み込まれることを期待しましょう。

于 2012-08-14T09:57:44.457 に答える