Wednesday, 18 September 2013

Raphaeljs path id inside a set attributes

Raphaeljs path id inside a set attributes

I'm working on a map with Raphaeljs and I have the paths inside a set
because I want all of them to have the same attributes and all is good but
now I would like to set an id to each path and I did it to one but the
attributes got lost, so my question is...Is there a way to have an path.id
inside a set with the set attributes? Thanks
Here is the file http://jsfiddle.net/tLSpv/2/
var paper = Raphael(0,0,540, 615);
var newmexico = paper.set();
newmexico.push(
paper.path("M343.249,11.503l-1.658,3.554l-0.474,16.822c0,0-3.554-0.711-5.449-0.711
s-5.686,3.554-5.449,4.265c0.237,0.711-1.895,13.268-1.895,14.215s3.554,4.502,3.317,5.449c-0.237,0.948-0.711,3.554-0.474,4.502
c0.237,0.948,0.711,7.345,0.474,9.477c-0.237,2.132,0.948,11.846-1.658,13.268h42.883v5.449h38.855h37.197V73.103l1.303-1.303V1.239
L340.643,1.18v4.4L343.249,11.503z").node.id = 'colfax'; colfax.attr
paper.path("M448.917,73.103 448.917,87.793 448.917,93.005 469.529,93.005
469.529,101.771 506.963,101.771 506.963,111.248 506.252,111.248
506.252,139.205 533.498,139.205 533.498,56.637 539.421,56.637
539.421,1.286 450.22,1.239 450.22,71.8z"),
paper.path("M506.015,139.205 506.015,177.113 482.56,177.113 482.56,193.46
461.475,193.46 439.598,203.965 439.598,225.13 438.888,225.841
438.888,262.405 454.84,262.405 454.84,262.09 454.84,262.405 476.36,262.405
476.36,253.718 496.103,253.718 496.103,243.648 505.146,243.648
505.146,234.961 514.386,234.961 514.386,224.971 533.498,224.971
533.498,139.205 506.252,139.205z"),
paper.path("M143.759,9.845c0,0-2.132,3.554-3.317,3.554s-12.32,9.714-12.32,9.714V86.05
l5.923,1.269l40.751,0.474h18.717v22.982h56.151v4.311l0.059,0.013l-0.059-0.013v3.271h17.769v-7.108h30.326v3.125l4.738,0.902
l3.08-1.185l6.634-0.237l3.08-4.502l-13.031-5.686c0,0-8.055-4.738-9.003-7.818c-0.948-3.08-11.372-11.846-11.372-11.846
l-4.265-1.658c0,0-8.529-1.895-9.24-3.08c-0.711-1.185,0.474-3.791,0.474-3.791l4.502-1.658l3.317-1.895v-9.003l0.474-11.372
l-2.606-11.846l0.711-5.686l-1.185-6.871v-6.634l0.237-9.714l-4.265-9.477l-0.032-0.173l-124.69-0.066l-2.031,4.74L143.759,9.845z"),
paper.path("M454.844,262.343 454.844,318.731 454.844,262.343
438.893,262.343 438.893,243.548 438.891,243.548 419.78,243.548
419.78,253.183 411.408,253.183 411.408,262.286 411.408,262.344
371.131,262.344 371.131,289.611 371.131,289.827 370.509,289.827
370.509,317.31 380.134,317.31 380.134,326.471 400.352,326.471
400.352,328.051 436.681,328.051 436.681,318.889 454.873,318.889
454.873,262.343z")) .attr({ fill: '#F7F0EA', stroke: '#006599',
'stroke-width': 1, cursor: 'pointer' })
.hover(function () {
this.animate({fill: '#006599'}, 300);
},
function () {
this.animate({fill: '#F7F0EA'}, 300)
}
);

No comments:

Post a Comment