【问题标题】:Resizing Google Maps api v3 DIV with jquery - tiles not refreshing properly使用 jquery 调整 Google Maps api v3 DIV 的大小 - 磁贴未正确刷新
【发布时间】:2012-03-21 05:46:31
【问题描述】:

我正在使用 Google Maps api v3 创建可以调整大小的地图(使用 jQuery 切换扩展和收缩 div)。通过研究我发现我应该调用 google.maps.event.trigger(map, 'resize');调整地图大小时。我已经这样做了,但我仍然无法刷新瓷砖。

我使用的代码是:

<script>
document.write('<a id="expandMap" href="#" target="_blank" title="Expand the map">+ expand map</a>');

/* Expand map_canvas DIV */

jQuery('#expandMap').toggle(function(){
jQuery('a#expandMap').text('- contract map');
jQuery('a#expandMap').attr('title', 'Contract the map');
jQuery('#map_canvas').animate({'height': '600px'}, 750, 'swing');
google.maps.event.trigger(map, 'resize');
}, function(){
jQuery('a#expandMap').text('+ expand map');
jQuery('a#expandMap').attr('title', 'Expand the map');
jQuery('#map_canvas').animate({'height': '193px'}, 750, 'swing');
google.maps.event.trigger(map, 'resize');
});

/* Expand map_canvas DIV End */
</script>

任何人都可以提出任何想法吗?展开时,如果您单击合同按钮,则会出现一个闪烁,其中所有图块都正确可见,因此看起来在收缩时触发了调整大小事件。在收缩状态下,地图完美运行;平移所有图块都会刷新。

非常感谢您对此的任何帮助!

干杯!

【问题讨论】:

    标签: google-maps google-maps-api-3


    【解决方案1】:

    animate() 需要一些时间。

    你必须至少在动画完成时触发地图的调整大小事件(另外你可以在每一步触发它),而不是在它开始时

    【讨论】:

    • 太棒了,非常感谢Molle博士。更改了代码以使用完整的回调函数,它很有魅力。干杯!
    • 如果对您有用,您应该将此答案标记为“已接受”。点击左侧的勾号即可。
    猜你喜欢
    • 1970-01-01
    • 2012-08-15
    • 2010-12-06
    • 1970-01-01
    • 2015-08-23
    • 1970-01-01
    • 1970-01-01
    • 2012-02-26
    • 1970-01-01
    相关资源
    最近更新 更多