gpt4 book ai didi

javascript - 谷歌地图未优化的标记/fitBounds

转载 作者:行者123 更新时间:2023-11-29 17:58:53 25 4
gpt4 key购买 nike

我正在使用 Selenium 编写验收测试来测试使用 Google Maps API 的应用程序。为了测试 map 标记的位置,我是 using un-optimized markers和独特的标题属性,使我能够定位标记元素(来自带有 XPath 查询的 Selenium)。

我遇到了一个问题,即当使用未优化的标记时,调用 google.maps.Map.fitBounds() 会导致标记从 DOM 中移除。您必须重复调用 fitBounds() 才能发生这种情况。 这只会发生在未优化的标记上,并且应用程序本身会按预期工作。

我写了一个简短的测试脚本来在浏览器中复制:请运行下面的命令。

我也做了create a fiddle .

我在 API 文档中没有看到任何相关内容。

任何帮助都会很棒。

<html>
<head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script>
<style type="text/css">
#container {
width: 800px;
height:500px;
}
</style>
</head>
<body>
<button id="show">Show</button>
<button id="hide">Hide</button>
<div id="container"></div>
<script type="text/javascript">

// Repeatedly click on 'Hide' then 'Show' (8+ times sometimes). At some point the markers disappear and not come back - even if the code for showing/hiding markers is entirely commented out.
// The issue seems to be with the map.fitBounds() call when un-optimized markers are being used.
// Note - un-optimized markers are needed for targeting marker HTML elements as part of an acceptance test.
// Replicated on: 45.0.2 Firefox; 49.0.2623.112 m Chrome.

function changeBounds(boolToggle) {
//return; // TODO - if you add this line in the problem is fixed.
var bounds = new google.maps.LatLngBounds();
var latLng = boolToggle ? new google.maps.LatLng(70, 70) : new google.maps.LatLng(30, 30);
bounds.extend(marker1.getPosition());
bounds.extend(marker2.getPosition());
bounds.extend(latLng);
map.fitBounds(bounds);
}

var mapOptions = {
center : { lat : 50, lng : 50 },
zoom: 5,
};

var map = new google.maps.Map(document.getElementById("container"), mapOptions);

var marker1 = new google.maps.Marker({
position : {
lat : 51,
lng : 51,
},
title : "MARK1",
optimized : false
});

var marker2 = new google.maps.Marker({
position : {
lat : 52,
lng : 52,
},
title : "MARK2",
optimized : false
});

marker1.setMap(map);
marker2.setMap(map);

document.getElementById('show').onclick = function() {
//marker1.setVisible(true); // TODO - The original code was showing/hiding the markers but the issue is replicated without even doing this.
//marker2.setVisible(true);

changeBounds(true);
}

document.getElementById('hide').onclick = function() {
//marker1.setVisible(false); // TODO - The original code was showing/hiding the markers but the issue is replicated without even doing this.
//marker2.setVisible(false);

changeBounds(false);
}
</script>
</body>
</html>

编辑:我已将此报告为 Google 的错误。参见 https://code.google.com/p/gmaps-api-issues/issues/detail?id=9912

最佳答案

我不知道问题出在哪里,一定是 Google Maps API 中的某个问题,但我找到了解决方案:使用 pan* 方法。对我来说,最好的方法是使用 panBy,它告诉 map 平移 x 和 y 像素。移动 0 个像素效果很好,所以只需在 fitBounds 修复消失标记后添加 map.panBy(0,0)。

但是,这意味着失去了 map 逐渐移动的好处,所以我在空闲事件上使用了 panBy。最终的解决方案是在创建 map 后添加以下内容:

google.maps.event.addListener(map, 'idle', function() {
map.panBy(0,0);
});

抱歉,我没有足够的时间来筛选 Google API 以真正了解问题所在。

什么没用:

  • marker.setMap(或任何其他属性)
  • 标记是否可拖动
  • google.maps.event.trigger(map, 'some_event');

相关:

关于javascript - 谷歌地图未优化的标记/fitBounds,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36681258/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com