不规则折线谷歌地图

时间:2014-10-29 07:58:08

标签: google-maps google-polyline

我已经为谷歌地图实施了折线,用于加入谷歌地图上的标记。 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); 

  });

}

1 个答案:

答案 0 :(得分:0)

使用您在案例“flightPlanCoordinates”数组中传递的数组创建折线。它将数组的第一个点连接到第二个点,第二个点连接到第三个点,依此类推。如果您的数组本身包含这些点,那么它们将在折线中绘图。一种解决方案是从数据库中删除不规则点。您需要检查的另一件事是检索的点是否按正确顺序排列。这应该消除不规则的形状。