我有一个JSON数组,有多个纬度和经度路径。它看起来如下:
我的要求是使用不同的颜色在地图上绘制每个旅程,但我的脚本以一种颜色绘制所有旅程:
使用的代码是:
<script>
function initialize() {
var jsonValues = '<?php echo $json; ?>';
var oJsonObj = JSON.parse(jsonValues);
console.log(oJsonObj);
var mapOptions = {
zoom: 13,
center: new google.maps.LatLng(6.932088333333334, 79.84256166666667),
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
Object.size = function(obj) {
var size = 0, key;
for (key in obj) {
if (obj.hasOwnProperty(key)) size++;
}
return size;
};
var numJournies = Object.size(oJsonObj);
var journey = [];
$.each(oJsonObj, function(ind,val){
var r = Math.floor(Math.random() * 255);
var g = Math.floor(Math.random() * 255);
var b = Math.floor(Math.random() * 255);
color= "rgb("+r+" ,"+g+","+ b+")";
var journey = [];
$.each(val, function(i,v){
journey.push(new google.maps.LatLng(v.latitude, v.longitude));
});
polyline = new google.maps.Polyline({
path: journey,
strokeColor: color,
strokeOpacity: 1.0,
strokeWeight: 3
});
polyline.setMap(map);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
非常感谢任何帮助。
此致
答案 0 :(得分:0)
使用不同颜色的一个数组。
var Colors = ["#FF0000", "#00FF00", "#0000FF", "#FFFFFF", "#000000", "#FFFF00", "#00FFFF", "#FF00FF"];
现在,不是绘制一条折线,而是为每个坐标绘制一条单独的折线。
for (var i = 0; i < DrivePath.length-1; i++) {
var PathStyle = new google.maps.Polyline({
path: [DrivePath[i], DrivePath[i+1]],
strokeColor: Colors[i],
strokeOpacity: 1.0,
strokeWeight: 2,
map: map
});
}