Raphael JS可以选择性地点击子集

所以我有一篇论文有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); } 

Answer 1

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

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

 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")); }); 

然后你只需要调用translate事件 – 顺便说一句，你应该在你有机会时适应transform（），因为translate已被弃用 – 对于this.data("myset")

如果集合中的多个对象是可拖动的，那么您可以执行稍微不同的操作：使用.data()向对象添加“candrag”属性，如果您希望拖动它们，则为true。 然后在拖动集合时检查此值，并且如果单击的对象对此值具有“true”，则仅转换（也称为转换）该集合。 类似的想法。