0

So I tried to use translate and call the drag event on the set when certain elements in the set have the drag event intiated on them. But it's a little slow. Does anyone know how to optimize to make it faster?

Here's the function im using 

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);        
    }
});

};

Is there a way to make this faster without drawing an invisible element over the pieces that I want to make draggable and attaching the handlers to those?

Karmanya Aggarwal
  • 508
  • 5
  • 11
  • Repeat, more or less, of this question. If you're iterating through a set, you're probably not using it well. http://stackoverflow.com/questions/15379158/raphael-js-making-sub-sets-selectively-clickable/15384889#15384889 – Chris Wilson Mar 22 '13 at 14:42
  • I know it's a repeat of the question, but I don't know of a better way to use it. Im rather new to this. – Karmanya Aggarwal Mar 23 '13 at 15:05

1 Answers1

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() {}
user2799692
  • 1