谷歌地图API-地图错放在框架上

Google Maps API - Map misplaced on frame

本文关键字：框架 API- 地图 谷歌地图      更新时间：2023-09-26

链接：http://www.bastosviegas.com/mapa（请滚动"interactiveo"查看谷歌地图）

正如你所看到的，地图没有以正确的坐标为中心，直到你最大化/最小化页面，它才会出现错误。

有人碰到这个bug了吗？如果是的话，你是怎么做对的？

这不是一个错误，无论何时操作包含地图的div，都应该使用以下触发器触发地图调整大小：google.maps.event.trigger(map, 'resize');

我将把这个触发器添加到mouseover事件中。

这里有一个例子：

function initialize() {
    var map;
    var centerPosition = new google.maps.LatLng(38.713107, -90.42984);
    var options = {
        zoom: 6,
        center: centerPosition,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map($('#map')[0], options);
    //when map is shown, trigger resize
    $('#hoverbtn').hover(function(){
       $('#map').show(); 
       google.maps.event.trigger(map, 'resize');
    });
}

上面代码的Fiddle示例

相关文章：