在我看来,Google对Google Maps API显示折线的方式做了一些更改。直到上次我检查(3个月前)Polylines总是在所有缩放级别都可见。完全缩小后,折线只会是地图上的一个小点。
现在,当我缩小时,使用相同的代码(基本上只是谷歌提供的示例代码),折线将消失。只有在折线的航点非常接近的情况下才会发生这种情况。
示例:当完全缩小时,限制在小城镇某些街道上的折线将不可见。连接到距离为1000英里的点的折线始终可见。
如何在所有缩放级别显示短折线,即使它只是一个小点?
此处示例:
https://plnkr.co/edit/v7FksNUxlpm1f6ag0iQs?p=preview
只是缩小,在某些时候折线会消失,这是我不想要的。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Simple Polylines</title>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 18,
center: {lat: 37.772, lng: -122.214},
mapTypeId: google.maps.MapTypeId.TERRAIN
});
var flightPlanCoordinates = [
{lat: 37.772, lng: -122.214},
{lat: 37.771, lng: -122.215},
{lat: 37.770, lng: -122.216},
{lat: 37.760, lng: -122.218}
];
var flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
geodesic: true,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 40
});
flightPath.setMap(map);
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>
</body>
</html>
答案 0 :(得分:0)
在另一个线程循环上调用zoomIn或zoomOut。 (例如setTimeout(event)