javascript - 如何在谷歌地图中更改图像最后一个点和第一个点的颜色

Question

我们得到 4 个纬度和 4 个经度。我们使用 Polyline 在点之间拖动线

  var flightPath = new google.maps.Polyline({
      path: flightPlanCoordinates2,
      geodesic: true,
      strokeColor: '#FF0000',
      strokeOpacity: 1.0,
      strokeWeight: 2
  });  
  flightPath.setMap(map);

我们在这样的点上添加图像

var image ='../images/shopimageformapsyellow.png';
var marker = new google.maps.Marker({
    position:mapCenter,
    map: map,
    icon: image
 });

工作正常，但是 4 个点有一个图像，例如黄色图像。我们需要开始点和结束点红色图像以及剩余的黄色图像。请指导我如何放置第一个点和最后一个点有不同的图像

我们尝试过这样

var icons1 = {
          start: new google.maps.MarkerImage('../images/startRed.png'),
          end: new google.maps.MarkerImage('../images/startGreen.png')
         };



flightPath = new google.maps.Polyline({
                  icons: [{
                        icon: icons1,
                    }],
                path: flightPlanCoordinates2,
                geodesic: true,
                strokeColor: '#FF0000',
                strokeOpacity: 1.0,
                strokeWeight: 2,
                fillColor: '#FF0000',
                fillOpacity: 0.35
              });  
            flightPath.setMap(map);

但是我们没有运气请任何人指导我

Answer 1

我建议您使用 Leaflet，它是一个开源 Javascript 库，用于移动友好的交互式 map 。

通过它，您可以为标记提供自定义图像，也可以为标记图像提供替代颜色。

请引用以下link了解更多详情。

希望有帮助!!