Question

我刚开始使用snap.svg。如果没有传递参数，element.drag()函数会提供一组默认值，否则您必须定义自己的onmove，onstart和onend函数。

onmove(dx,dx,x,y,event)的参数可用于onmove的实现，以移动元素。

如果我创建了一组元素，默认的g.drag()允许该组移动，但我无法弄清楚要放在我自己的onmove中以使该组移动。

this.attr({cx: posx , cy: posy});适用于.circle。 x的等效y，.group是多少？

Answer 1

以下是我刚测试过的一个例子：

var s = Snap("#svg");

Snap.load("draw.svg", function(f) {
g = f.select("g");
s.append(g);

g.cx = 40;
g.cy = 140;
g.ox = 0;
g.oy = 0;

g.drag(dragging, startDrag, function(evt) {
            console.log("dropped at: "+ evt.x + ", " + evt.y);
        });


});

startDrag = function(posx, posy) {
  this.ox = posx - this.cx;
  this.oy = posy - this.cy;
}

dragging = function(dx, dy, posx, posy) {
  this.cx = posx - this.ox;
  this.cy = posy - this.oy;
  t = 't' + this.cx + ',' + this.cy;
  this.transform(t);
}

希望它会有所帮助。

Answer 2

您可以对组元素使用transform方法。

dragging = function(dx, dy, posX, poxY, event){
    this.transform("translate("+posX+","+posY+")");
}

snapsvg .drag（）attr定义

2 个答案: