为每条路线随机化谷歌地图折线颜色答案

【问题标题】：Randomize in google map polyline color for each route为每条路线随机化谷歌地图折线颜色
【发布时间】：2018-05-18 09:44:17
【问题描述】：

在这里，我们尝试通过颜色来区分来自单一来源的折线。提供给折线的数据包含具有另一个属性的 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                  
             });

【问题讨论】：

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

标签： javascript c# angularjs sql-server google-maps

【解决方案1】：

你可以这样做：

// 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;
  }

如果有帮助请告诉我

Random color generator

【讨论】：