拉斐尔拖着整整一套

时间:2014-05-09 07:13:29

标签: javascript drag-and-drop raphael

我在小提琴中使用拖动功能,但我想移动rect和text togehter因为我将拖动不仅应用于矩形。如何更改拖动功能以移动整个设置?

 start = function() {
        this.ox = this.type == "rect" ? this.attr("x") : this.attr("cx");
        this.oy = this.type == "rect" ? this.attr("y") : this.attr("cy");
        this.attr({
            opacity: 1
        });

        // Save the dragged object in global namespace.
        window.someVar = this;
    },

    move = function(dx, dy) {
        var att = this.type == "rect" ? {
            x: this.ox + dx,
            y: this.oy + dy
        } : {
            cx: this.ox + dx,
            cy: this.oy + dy
        };
        this.attr(att);
    },
    up = function() {
        this.attr({
            opacity: .5
        });
    delete window.someVar;
    };

http://jsfiddle.net/Margo/Q3EBw/3/

1 个答案:

答案 0 :(得分:0)

更改set refrance的attr。如果你有很多套,你需要检查女巫this.id是否使用那套。

http://jsfiddle.net/Margo/Q3EBw/5/

paper = Raphael(0, 0, 500, 500);
var ox = 0;
var oy = 0;
var screenSet = paper.set();
screenSet.push(paper.rect(0, 0, 100, 75, 0).attr({
        fill: 'red', stroke: 'none'
    }));

screenSet.push(paper.text(0 , 0 ,"Text").attr({ "text-anchor": "start" }));

    start = function() {

        ox =  this.attr("x");
        oy = this.attr("y");
        screenSet.attr({
            opacity: 1
        });
},

    move = function(dx, dy) {
        var att ={
            x: ox + dx,
            y:oy + dy
        };
        screenSet.attr(att);
    },
    up = function() {
        this.attr({
            opacity: .5
        });
        ox = 0, oy = 0;
    };
screenSet.drag(move, start, up);