谷歌地图标记未居中答案

【问题标题】：Google Maps marker not centered谷歌地图标记未居中
【发布时间】：2012-09-05 08:31:56
【问题描述】：

我正在使用谷歌地图在一个隐藏的 div 下显示，该 div 会在单击选项卡时切换，我有两个问题，也许它们是相关的：

地图未完全显示
标记不在地图的中心，它位于地图的左上角

我正在粘贴代码，请指导我哪里出错或有任何建议。

    var map = new GMap2(document.getElementById(mapid));
    if( maptype == 'G_NORMAL_MAP' )
    {

        map.setCenter(new GLatLng(startLatitude,startLongitude ), 6);
        map.addControl(new GLargeMapControl());     
    }
    else if( maptype == 'G_SATELLITE_MAP' )
    {
        map.setCenter(new GLatLng(startLatitude,startLongitude ), 18);
        map.addControl(new GLargeMapControl());
        map.setMapType(G_SATELLITE_MAP);
        map.setUIToDefault();
        map.enableRotation();
    }
    else if( maptype == 'G_AERIAL_MAP' )
    {
        map.setCenter(new GLatLng(startLatitude,startLongitude ), 18);
        map.addControl(new GLargeMapControl());
        map.setMapType(G_AERIAL_MAP);
        map.setUIToDefault();
        map.enableRotation();
    }
    else if( maptype == 'G_AERIAL_HYBRID_MAP' )
    {
        map.setCenter(new GLatLng(startLatitude,startLongitude ), 18);
        map.addControl(new GLargeMapControl());
        map.setMapType(G_AERIAL_HYBRID_MAP);
        map.setUIToDefault();
        map.enableRotation();
    }

    // Add 10 markers to the map at random locations
    var bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    var lngSpan = northEast.lng() - southWest.lng();
    var latSpan = northEast.lat() - southWest.lat();
    var point = new GLatLng(startLatitude, startLongitude);
    map.setCenter(bounds.getCenter());

    map.addOverlay(new GMarker(point));

【问题讨论】：

您的语法是 API V2，它已被弃用并且可能随时停止工作。考虑升级到当前版本 (V3)。
好吧，我现在不能，我现在必须完成这项工作

标签： javascript google-maps google-maps-markers google-maps-api-2

【解决方案1】：

这段代码每次都用标记中心对齐来渲染谷歌地图。

        var lattitude = data.getLatitude ;
        var longitude = data.getLongitude;
        var pointLatLong = new google.maps.LatLng(lattitude,longitude);
        var pointOptions = {
            zoom: 10,
            center: pointLatLong,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById("map-canvas"), pointOptions);
        var pointMarker = new google.maps.Marker({
            position: pointLatLong,
            title: ""
        });
        pointMarker.setMap(map);
        google.maps.event.addListenerOnce(map, "idle", function () {
            google.maps.event.trigger(map, "resize");
            map.setCenter( pointLatLong );
        });

参考：http://www.onlinekurukshetra.com/google-map-not-loading-completely/

【讨论】：

【解决方案2】：

尝试为标记添加：position:map.getCenter()，以便您的标记位于地图的中心

【讨论】：

【解决方案3】：

完全定义地图 div 的大小，或者使用构造函数的可选“size”参数：

map = new GMap2(document.getElementById(mapid),{size:new GSize(510,200)});

或者打开标签后在地图对象上运行 checkResize() 方法

【讨论】：

您能否发布一个指向显示问题的地图（或 jsfiddle）的链接（或您尝试上述方法但没有成功的地方）？
不知道您使用的是什么浏览器，但在 chrome 中它什么也没做。我在要初始化的主体 onload 调用上未定义一个可能不相关的“初始化”，然后是来自 v2 配额服务的“加载资源失败：服务器响应状态为 403（禁止）”。您使用的密钥似乎未针对此域启用。
chromer/firfox 15.0，即都一样，initialize()和地图无关，在地图标签点击时调用脚本

【解决方案4】：

尝试添加

var zoom = map.getZoom();
var center = map.getCenter();
map.checkResize();
map.setCenter(center,zoom);

切换地图 div 之后。

【讨论】：

TypeError: map.checkResize 不是函数