Raphel image drag 拖动

<script> window.onload = function () { var R = Raphael(0, 0, "100%", "100%"), r = R.circle(100, 100, 50).attr({fill: "hsb(0, 1, 1)", stroke: "none", opacity: .5}), g = R.circle(210, 100, 50).attr({fill: "hsb(.3, 1, 1)", stroke: "none", opacity: .5}), b = R.circle(320, 100, 50).attr({fill: "hsb(.6, 1, 1)", stroke: "none", opacity: .5}), p = R.circle(430, 100, 50).attr({fill: "hsb(.8, 1, 1)", stroke: "none", opacity: .5}); var start = function () { this.ox = this.attr("cx"); this.oy = this.attr("cy"); this.animate({r: 70, opacity: .25}, 500, ">"); }, move = function (dx, dy) { this.attr({cx: this.ox + dx, cy: this.oy + dy}); }, up = function () { this.animate({r: 50, opacity: .5}, 500, ">"); }; R.set(r, g, b, p).drag(move, start, up); }; </script>以上是官方拖动的源代码，可惜是circle

而你要拖动的可能是矩形和image,他的坐标不是cx cy 所以要把cx cy改成xy

 window.onload = function () {
         var R = Raphael(document.getElementById('canvas_container'),"1000", "1000");
             // r = R.circle(100, 100, 50).attr({fill: "hsb(0, 1, 1)", stroke: "none", opacity: .5}),
             //g = R.circle(210, 100, 50).attr({fill: "hsb(.3, 1, 1)", stroke: "none", opacity: .5}),
             //b = R.circle(320, 100, 50).attr({fill: "hsb(.6, 1, 1)", stroke: "none", opacity: .5}),
             //p = R.circle(430, 100, 50).attr({fill: "hsb(.8, 1, 1)", stroke: "none", opacity: .5});
         var cc=R.image("host1.png",30,40,120,120).attr({
           stroke: "none",
           opacity: .5,
           cursor:"pointer"
        });
         start = function () {
             this.ox = this.attr("x");
             this.oy = this.attr("y");
             this.animate({r: 70, opacity: .25}, 500, ">");
         },
         move = function (dx, dy) {
             this.attr({x: this.ox + dx, y: this.oy + dy});
         },
         up = function () {
             this.animate({r: 50, opacity: .5}, 500, ">");
         };
          //R.image("host1.png", 800, 170, 72, 72).drag(move, start, up);
          R.set(cc).drag(move, start, up);
     };