我已经为谷歌地图实施了折线,用于加入谷歌地图上的标记。 Polyline正在显示,但它正在尝试连接所有点(也有一些孤立的点),这会产生不规则的形状。请点击以下链接查看快照。
irregular polyline google maps irregular polyline google maps_1
我需要重新审视那些不规则的形状。有什么办法可以吗?如果不是我应该去使用谷歌地图的一些其他功能来实现相同的。我正在使用从中导入lat long的mysql数据库,并在地图上显示xml输出。我们将不胜感激。如果您对我的疑虑不清楚,请随时询问详细说明。我很乐意澄清每一点。
我的代码如下
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(23.00000, 80.00000),
zoom: 5,
mapTypeId: 'roadmap'
});
var infoWindow = new google.maps.InfoWindow;
var flightPlanCoordinates = new google.maps.MVCArray();
var bounds = new google.maps.LatLngBounds();
// Change this depending on the name of your PHP file
downloadUrl("navigatormapxml.php", function(data) {
var xml = data.responseXML;
var gpsdata = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < gpsdata.length; i++) {
var id = gpsdata[i].getAttribute("id");
var point = new google.maps.LatLng(
parseFloat(gpsdata[i].getAttribute("lat")),
parseFloat(gpsdata[i].getAttribute("lng")));
flightPlanCoordinates.insertAt(flightPlanCoordinates.length, point);
var speed = gpsdata[i].getAttribute("speed");
var altitude = gpsdata[i].getAttribute("altitude");
var html = "<b>Accuracy = +/- </b>" + id + "<br/><b> Speed = </b>" + speed + " Kmph";
var icon = customIcons[id] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
bounds.extend(point);
map.fitBounds(bounds);
map.panToBounds(bounds);
bindInfoWindow(marker, map, infoWindow, html);
}
var flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 5
});
flightPath.setMap(map);
});
}
答案 0 :(得分:0)
使用您在案例“flightPlanCoordinates”数组中传递的数组创建折线。它将数组的第一个点连接到第二个点,第二个点连接到第三个点,依此类推。如果您的数组本身包含这些点,那么它们将在折线中绘图。一种解决方案是从数据库中删除不规则点。您需要检查的另一件事是检索的点是否按正确顺序排列。这应该消除不规则的形状。