javascript - Raphael jsのドラッグアンドドロップの説明?

Question

ビューソース:http://raphaeljs.com/touches.html

http://raphaeljs.com/touches.html

このドラッグアンドドロップの例が機能する理由を誰かが説明してくれたら幸いです。各関数が何をしているのかを大まかに集めることはできますが、動くように指示するものが何もないのに、なぜこれが動くのかをまとめることはできません。

Answer 1

このmove関数はコールバックとして動作し、2 つの引数を取りますdx, dy。これらは、それぞれデルタ X とデルタ Y を表します。

次の行が表示された場合:

this.attr({cx: this.ox + dx, cy: this.oy + dy});

ox と oy は、それぞれ original-X と original-Y を表しています。

したがって、元の X + デルタ X と元の Y + デルタ Y を指定する引数で attr 関数が呼び出されていると推測できます。

わかる？

animate 呼び出しと混同しないでください。これらは、開始/停止時に形状を拡大/縮小するためのものです。マウスを動かすたびにmove関数が呼び出され、attrが更新されます。