在RaphaelJS中优化拖放设置

时间:2013-03-22 03:42:28

标签: raphael

因此,当集合中的某些元素在其上启用了拖动事件时,我尝试使用translate并调用集合上的拖动事件。但它有点慢。有谁知道如何优化以使其更快?

这是使用

的功能
function dragsymbolsoncanvas(foo){//foo is the set passed. 
function dragger(){
    this.dx = this.dy = 0;
};
function mover(s){
    return function(dx, dy){
        (s||this).translate(dx-this.dx,dy-this.dy);
        this.dx = dx;
        this.dy = dy;
    }
};
foo.forEach(function(herp){//set.forEach function from raphaeljs
    if(herp.data("candrag")=="true"){
        foo.drag(mover(foo), dragger);        
    }
});

};

有没有办法让这个更快,而不会在我想要拖拽的部分上绘制一个不可见的元素并将处理程序附加到那些?

1 个答案:

答案 0 :(得分:0)

    var position;
    var rect = paper.rect(20, 20, 40, 40).attr({
            cursor: "move",
            fill: "#f00",
            stroke: "#000"
    });
    t = paper.text(70,70, 'test').attr({
            "font-size":16, 
            "font-family": 
            "Arial, Helvetica, sans-serif" 
    });
    var st = paper.set();
    st.push(rect, t);
    rect.mySet = st;
    rect.drag(onMove, onStart, onEnd);
    onStart = function () {
        positions = new Array();
        this.mySet.forEach(function(e) {
            var ox = e.attr("x");
            var oy = e.attr("y");
            positions.push([e, ox, oy]);
        });
    }
    onMove = function (dx, dy) {
        for (var i = 0; i < positions.length; i++) {//you can use foreach but I want to                 show that is a simple array
            positions[i][0].attr({x: positions[i][1] + dx, y: positions[i][2] + dy});
        }
    }
    onEnd = function() {}