Javascript 在谷歌地图中为每条管线随机设置多段线颜色

在这里，我们试图通过源于单个源的颜色来区分多段线。提供给多段线的数据包含lat、lng和其他属性。其他道具。将有多个latlng记录

// Here we created a map object.
var mapOptions = {
    zoom: 6,
    center: new google.maps.LatLng(20.59, 78.96),
    mapTypeId: google.maps.MapTypeId.TERRAINr
};
// Here we get the map id of the html page.
$scope.map = new google.maps.Map(document.getElementById('map'), 
mapOptions);   
// Here we assign data for the polyline path prop.
var tripdata=[];
tripdata=[
id:1, {lat:23.333, lng:87.777},
id:2, {lat:24.343, lng:78.876}
];
var vehiclePath; // Here we declare a variable of polyline object.
vehiclePath = new google.maps.Polyline({
                 path: tripdata,
                 geodesic: true,
                 strokeColor: '#0000FF',
                 strokeOpacity: 1.0,
                 strokeWeight: 2,                    
                 map: $scope.map                  
             });

您可以这样做：

// Here we created a map object.
var mapOptions = {
    zoom: 6,
    center: new google.maps.LatLng(20.59, 78.96),
    mapTypeId: google.maps.MapTypeId.TERRAINr
};
// Here we get the map id of the html page.
$scope.map = new google.maps.Map(document.getElementById('map'), 
mapOptions);   
// Here we assign data for the polyline path prop.
var tripdata=[];
tripdata=[
id:1, {lat:23.333, lng:87.777},
id:2, {lat:24.343, lng:78.876}
];
var vehiclePath; // Here we declare a variable of polyline object.
vehiclePath = new google.maps.Polyline({
                 path: tripdata,
                 geodesic: true,
                 strokeColor: getRandomColor(),
                 strokeOpacity: 1.0,
                 strokeWeight: 2,                    
                 map: $scope.map                  
             });

var colors = []; // empty array to ensure colours are unique
function getRandomColor(var id) {
  var color;
  do
    var letters = '0123456789ABCDEF';
    color = '#';
    for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
    }
  while(!colors.includes(color));
  colors.push(color);
  return color;
  }

//这里我们创建了一个映射对象。
变量映射选项={
缩放：6，
中心：新google.maps.LatLng（20.59,78.96），
mapTypeId:google.maps.mapTypeId.TERRAINr
};
//这里我们得到html页面的地图id。
$scope.map=new google.maps.map（document.getElementById（'map'），
地图选项）；
//这里我们为多段线路径属性指定数据。
var-tripdata=[]；
tripdata=[
id:1，{lat:23.333，lng:87.777}，
id:2，{lat:24.343，lng:78.876}
];
var车辆路径；//这里我们声明一个polyline对象变量。
vehiclePath=新建google.maps.Polyline({
路径：tripdata，
测地线：正确，
strokeColor:getRandomColor（），
笔划不透明度：1.0，
冲程重量：2，
map:$scope.map
});
var colors=[]；//空阵列，确保颜色独特
函数getRandomColor（变量id）{
颜色变异；
做
变量字母='0123456789ABCDEF'；
颜色='#'；
对于（变量i=0；i<6；i++）{
颜色+=字母[Math.floor（Math.random（）*16）]；
}
而（！colors.includes（color））；
颜色。推送（颜色）；
返回颜色；
}

如果有帮助，请告诉我

---

颜色必须是唯一的吗？对于id 1和id 2，旅行应该有不同的颜色。我添加了功能，以便只使用唯一的颜色。