1

所以我有一篇有 6 种符号的论文。每个符号都是圆圈和路径的集合。我只想制作一些可点击的圆圈来拖动集合。例如,如果一个符号有 2 个圆圈和一个路径 - 我希望能够单击其中一个圆圈来拖放集合(有据可查的东西)。如果用户点击另一个圆圈 - 什么都不会发生。由于我的 Raphael 元素是由用户动态创建的 - 我将每个集合在创建时推送到数组中。我是否可以访问集合中的特定圆圈并通过集合数组使其可点击?

这是我插入集合的方法

{
paper.setStart();
    var circ = paper.circle(x,y,35); //first circle - should be clickable
    var conpoints = insConPoint1(paper,x,y);
    var pathright = conpoints.path;
    var conPoint1 = conpoints.conpoint; //this is a second circle - should not be clickable
var st = paper.setFinish();
symbolarray.push(st);
}

这也是我使集合可拖动的方法

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;
    }
};
for(var i = 0; i<symbolcount;i++){
    symbolarray[i].drag(mover(symbolarray[i]), dragger);    
}
4

1 回答 1

1

没问题。有两种方法可以做到:

如果只有一个圆圈是可拖动的,只需将拖动事件附加到该圆圈,但在集合上调用 translate,而不是在this(它将始终引用单个元素,即使拖动侦听器附加到集合对象。 ) 由于这是动态的,因此您可以使用 Raphael 的.data()函数找到合适的集合,该函数将键值对添加到 object,如下所示:

paper.setStart();
    var circ1 = paper.circle(100,100,35); //first circle - should be clickable
    var circ2 = paper.circle(50,50,25); // second circle - not clickable
var st = paper.setFinish();
st.data("myset", st);

st.click(function(e) {
   //returns the parent set
   console.log(this.data("myset")); 
});

然后你只需调用翻译事件 - 顺便说一句,你应该在有机会时适应 transform() ,因为不推荐使用翻译 - 结果是this.data("myset")

如果集合中的多个对象是可拖动的,那么您可以做一些稍微不同的事情:.data()如果您希望它们被拖动,则使用为对象添加“candrag”属性。然后在拖动集合时检查此值,并且仅在单击的对象对此值具有“真”时才转换(也称为平移)集合。类似的想法。

于 2013-03-13T12:07:29.333 回答