Question

Raphael中的拖动功能是object.drag（移动，开始，向上）

我的想法是检测对象在开始函数中的位置，如果对象的宽度或高度大于当前画布的大小，则重置画布大小，如增加100的高度或宽度。

var R = Raphael("canvas",500,500);

function rectangle(){
  var ox = 0; 
  var oy = 0;
  var rect = R.rect(100,100,10,20).attr({
fill: "white",
stroke: "black"
});

var start = function () {

    this.ox = this.attr("x");
    this.oy = this.attr("y");        

    this.box.ow = this.box.attr("width");
    this.box.oh = this.box.attr("height"); 

    },

    move = function (dx, dy) {

    this.attr({x: this.ox + dx, y: this.oy + dy});
    this.box.attr({width: this.box.ow + dx, height: this.box.oh + dy});

    if (this.attr("x") > R.width){
      R.width = R.width + 100;
    }

    if (this.attr("y") > R.height){
      R.height = R.height + 100;
    }

   R.setSize(R.width,R.height);

    },
    up = function () {
      ox = 0;
      oy = 0;

    };
 rect.drag(move, start, up);

  }
  window.onload = rectangle();

Rectangle是可拖动的，但是，画布的大小不会更新为矩形的位置。那我的代码出了什么问题？有人可以帮忙吗？

Answer 1

如果您有一个矩形，x和y坐标通常被认为位于左上角。如果您在画布中拖动矩形，则无法在画布外部使用x和/或y。

而不是检查

if (this.attr("x") > R.width){
      R.width = R.width + 100;
}

if (this.attr("y") > R.height){
  R.height = R.height + 100;
}

尝试检查(R.width-rect.width)之类的内容，无论矩形的值是多少。也为你的R.height和矩形的高度做同样的事情。

含义：

if (this.attr("x") > R.width-rectangleWidth){
      R.width = R.width + 100;
}

if (this.attr("y") > R.height-rectangleHeight){
  R.height = R.height + 100;
}

如何在拖动矩形时重置Raphael画布大小

1 个答案: