Raphael.js, comment sélectionner un élément?

Question

Dans Raphael, js, comment puis-je sélectionner un élément? Par exemple, si j'ai un rectangle, comment le sélectionner? Dans Raphael, est-il possible de sélectionner un élément comme la sélection de l'élément DOM en utilisant jQuery?

Answer 1

Pour sélectionner un élément DOM svg, en supposant qu'un noeud de l'élément raphael possède un ID, vous pouvez le faire dans le mode 'jQuery' par $('#ID') ou de la manière 'native' document.getElementById('ID').

De plus, en utilisant les événements de manipulation de raphael est très simple, par exemple lorsque vous cliquez sur un rectangle, vous pouvez 'sélectionner' il, de cette manière (démo ici =>http://jsfiddle.net/steweb/zMYU8/):

balisage:

<div id="canvas"></div> 

js:

var selected = null; //var to store selected element 

//initialize the raphael canvas and store it in a var 
var canvas = Raphael(document.getElementById("canvas"), 320, 200); 

//first rectangle 
var r = canvas.rect(10, 10, 50, 50).attr("fill", "#FFFF22"); 

//second rectangle 
var r1 = canvas.rect(70, 70, 50, 50).attr("fill", "#FFFF22"); 

//first rectangle click 
r.click(function(){ 
    //change attributes 
    r1.attr("stroke","black"); 
    r.attr("stroke","green"); 
    selected = r; //update selected var 
}); 

//second rectangle click 
r1.click(function(){ 
    //change attributes 
    r.attr("stroke","black"); 
    r1.attr("stroke","green"); 
    selected = r1; //update selected var 
});