Question

While playing around with Raphael.js Australia map, I tried assigning URLs for each element by changing their attribute in the end of the path:

country.cityone = R.path("coordinates").attr({href: "cityone.html"}).attr(attr);
country.citytwo = R.path("coordinates").attr({href: "citytwo.html"}).attr(attr);
...

The above works with Firefox, Chrome etc, but IE6-IE9 have trouble with that declaration.

So I thought of declaring another variable after var country and assigning the urls to that:

var url = {};
url.cityone = "cityone.html";
url.citytwo = "citytwo.html";

then calling it on mouse click/down:

    st[0].onmousedown = function() {

    current && country[current] && document.getElementById(“current”).appendChild(url);

    };

However it won’t work at all. Apparently I’m not making the call properly from the function, to relate each URL to its respective city. What am I missing?

Answer 1

I haven’t tested this but I’m pretty sure you should just do away with the href and add a mouse event:

country.cityone = R.path("coordinates").attr(attr).click(function(){
  window.location.href = "cityone.html";
});

I’m pretty sure that will work.