I know that this question has been asked before, and I've been trying to use the solutions that have been offered up for other peoples questions but I'm not having much luck. I'm using raphael.js to build a star map for Battletech. The map lists a bit more than 2100 stars. When the user hovers over a star, it displays the name of the star system and changes the cursor to a pointer. When the user clicks on the star, I open a new div with information about that star system. What I'm having trouble accomplishing is determining which star the user clicked so that I can provide the appropriate information. I'm been using the following URL as a guide: How to access id attribute of any element in Raphael
It's hard to list what exactly I've tried. If I try to retrieve the id, name or title, I get undefined. I think there's a problem in the way I'm defining the click event.
var flare = starfieldGlow.circle(cX, cY, 2).attr({'fill' : starMatch , 'stroke' : '#000000' , 'title' : worldList[i][0] , 'cursor' : 'pointer'});
flare.node.setAttribute('id',"star"+i);
flare.click(function() { starClickReturn() });
glowHolder.push(flare);
function starClickReturn() {
$('#starExplorer').show();
alert(this.id); - Tried many variants here.
}