Use .tofront() with raphael

Question

it seems i can't use .tofront() (no capital f) option in my map using raphael js

the fiddle links to my working example, it's javascript code and a bit of css3 for animate the path http://jsfiddle.net/6CvXF/20/

i would like each path goes to front when i click it, unfortunately this piece of code doesn't work

$('path').click(function() {
     (this).tofront();
});

there's a way better to retrieve the element to use in the click function? thanks

it is `toFront()`, check the documentation [link](http://raphaeljs.com/reference.html#Element.toFront) — Easwar Raju, Apr 24 '14 at 16:17

score 1 · Accepted Answer · edited May 23 '17 at 10:24

1

jQuery can't access the svg elements directly you can use this library: keith-wood.name/svg.html

mentioned here: How to use jquery in SVG (Scalable Vector Graphics)?

or you can simple use following built in Rapahel click function to achieve the result you are seeking:

    var r = Raphael("canvas",500,500);
    var rectangle = r.rect(10, 10, 100, 100).attr({fill:'red'}).click(function(){
                //click function statements
                this.toFront();
        });

edited May 23 '17 at 10:24

Community

1
1

answered Apr 24 '14 at 18:09

Code Hunter

78
1
8

thanks for your suggestion, i will discover jquery svg. how can i apply your code in this piece? thanks for(var civico in rosa) { rosa[civico].attr(style).node.id = 'pink'; } – Apr 25 '14 at 08:24
you can use the above code in your example as for(var civico in rosa) { rosa[civico].attr(style).node.id = 'pink'; rosa[civico].click(function(){ this.toFront();}) } also you should use sets to group the items like you path and their labels then you can also perform to front on all the elements of set this way you structure will not mess up. – Code Hunter Apr 27 '14 at 08:49

Use .tofront() with raphael

1 Answers1