Vertical crosshair reposition on Google Map after map resize Issue

Posted by joe on Stack Overflow See other posts from Stack Overflow or by joe
Published on 2010-06-12T05:45:15Z Indexed on 2010/06/12 5:52 UTC
Read the original article Hit count: 337

Filed under:
|
|

I use the following function to add a crosshair to my Google Map. It works great for horizontal resizing. I can not figure out how to make it work for vertical. After resizing the map it requires the user to either zoom in or out 1 layer, upon which the crosshair snaps to center.

var crosshairsSize=17;
GMap2.prototype.addCrosshairs=function(){
    var container=this.getContainer();
    if(this.crosshairs){$(this.crosshairs).remove();}
    var crosshairs=document.createElement("img");
    crosshairs.src='../images/crosshair2.gif';
    crosshairs.style.width=crosshairsSize+'px';
    crosshairs.style.height=crosshairsSize+'px';
    crosshairs.style.border='0';
    crosshairs.style.position='relative';
    crosshairs.style.top=((parseInt(container.clientHeight)-crosshairsSize)/2)+'px';
    crosshairs.style.left="0px"; // The map is centered so 0 will do
    crosshairs.style.zIndex='500';
    container.appendChild(crosshairs);
    this.crosshairs=crosshairs;
    return crosshairs;};

I use map.checkResize(); and the map is correct, it's just the crosshair that is off. I've tried firing a javascript zoom in one level but it doesn't work like zooming in with the mouse. It's only zooming in/out with the mouse scroll wheel too... clicking and dragging the zoom slider doesn't work so somehow it's liking the mouse scroll wheel.

Firing addCrosshairs(); after resize makes no difference. It places the new crosshair in old spot and still requires a mouse scroll zoom.

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about google