Question

我正在使用Gmaps.js来显示我从数据库中拉入的坐标，并且我正在尝试将所有标记连接在一起以形成路径。但我唯一能找到的是下面的代码。

如何修改此选项以在第一个和第二个标记以及第二个和第二个标记之间绘制路径，依此类推？

map.drawRoute({
  origin: [-12.044012922866312, -77.02470665341184],
  destination: [-12.090814532191756, -77.02271108990476],
  travelMode: 'driving',
  strokeColor: '#783bf2',
  strokeOpacity: 0.6,
  strokeWeight: 6
});

这是我尝试过的：

var latlng = new google.maps.LatLng(lat, longit);
bounds.push(latlng);

/* Add Marker */
map.addMarker({
  lat: lat,
  lng: longit,
  title: 'title',
});

$(latlng).each(function( index, element ) {
  map.drawRoute({
    origin: [lat, longit],
    destination: [lat + 1, lng + 1],
    travelMode: 'driving',
    strokeColor: '#131540',
    strokeOpacity: 0.6,
    strokeWeight: 6
  });
});

Answer 1

这是一种方法：

创建一个坐标数组：

var locations = [
  [30.465229, -97.759501],
  [30.459517, -97.754317],
  [30.452511, -97.750729],
  [30.444433, -97.742799],
  [30.436055, -97.734473],
  [30.429190, -97.722731]
];

循环坐标并绘制每对之间的路线：

for(var index = 0; index < locations.length; index++) {  
  if (index < locations.length - 1) {
    drawRoute(locations[index], locations[index + 1]);
  }
}

function drawRoute(origin, destination) {
  map.drawRoute({
    origin: origin,
    destination: destination,
    travelMode: 'driving'
  });
}

请查看this JSBin以获取上述代码的工作版本。

如何让Gmaps.js在动态标记javascript之间绘制路由？

1 个答案: