I'm creating a custom SVG overlay on google maps by extending the
OverlayView class. These SVG circles come in all sizes.
Unfortunately however when I click on an overlay, it also triggers a
click on my map, which (according to the docs) it should not (and i
don't want it to).
I'm assuming that I somehow have to specify the dimensions of my
overlay such that gmaps knows when the overlay being clicked but I'm
unclear on how to do this.
Any help is greatly appreciated. I've included a small sample below
as to how I'm creating my overlay, it's pretty much taken from the
examples.
// create my div and attach canvas to it
function init(){
div = document.createElement('div');
canvas = Raphael(div, width, width);
}
// create the circle in the canvas and attach div to pane
MyOverlay.prototype.onAdd = function(){
var circle = canvas.circle(width/2, width/2, diameter/2).attr(style);
var panes = this.getPanes();
panes.overlayLayer.appendChild(div);
};
// set center and dimensions of div
MyOverlay.prototype.draw = function(){
var overlayProjection = this.getProjection(),
centerPoint = overlayProjection.fromLatLngToDivPixel(position);
div.className = "circleOverlay";
div.style.left = centerPoint.x - width/2 + 'px';
div.style.top = centerPoint.y - width/2 + 'px';
div.style.width = width + 'px';
div.style.height = width + 'px';
};
MyOverlay.prototype.onRemove = function(){
div.parentNode.removeChild(div);
div = null;
};
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to google-maps-js-api...@googlegroups.com.
To unsubscribe from this group, send email to
google-maps-js-api-v3+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
