在可拖动函数SVG.js中获取宽度



我知道我可以通过width或size函数获得它,但我试图在创建可拖动对象的那一刻做到这一点。

我这样做是因为我需要给元素一个网格效果,并使它留在可绘制区域内。

下面是我想做的类似的事情:

square = draw.rect(size, size).x(x).y(y).draggable(function(x, y){
var xend = x - x % size;
var yend = y - y % size;
if(xend < 0)
    xend = 0;
if(yend < 0)
    yend = 0;
if(xend > 1000)
    xend = 1000 - width*;
return { x: xend, y: yend } 
});

带*的var就是我想要得到的。

也将是伟大的知道如何允许svg.js元素与jquery交互,但我想这是另一个问题。


Edit:嗯,现在我需要访问元素的其他属性,如果我不能从可拖拽元素中做到这一点我想我应该寻找另一种方法使其可拖拽?请帮帮我!

解决方案是(如Nils所说),使用正方形。Bbox函数,例如:

square = draw.rect(size, size).x(x).y(y).draggable(function(x, y){
var xend = x - x % size;
var yend = y - y % size;
if(xend < 0)
    xend = 0;
if(yend < 0)
    yend = 0;
if(xend > 1000)
    xend = 1000 - square.bbox().width;
return { x: xend, y: yend } 
});

另外,如果您想稍后访问该元素,您可以使用square.attr('id','id_name')方法分配id,并使用SVG.get('id_name')方法调用。

您可能对dragable -function的回调是在元素本身的作用域中调用的这一事实感兴趣。此外,这里不需要使用bbox,因为宽度是作为元素的属性存储的。

所以解决方案是:

square = draw.rect(size, size).x(x).y(y).draggable(function(x, y){
    var xend = x - x % size;
    var yend = y - y % size;
    if(xend < 0)
        xend = 0;
    if(yend < 0)
        yend = 0;
    if(xend > 1000)
        xend = 1000 - this.attr('width')
    return { x: xend, y: yend } 
});

顺便说一句:为什么你要搜索宽度和使用上面的几行大小?它的值是一样的因为你只是把宽度设为size

最新更新