用折线连接多个标记 [英] Connect Multiple markers with polyline
本文介绍了用折线连接多个标记的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我尝试了这段代码,但是折线没有运气,可能是因为问题太小,我无法获得连接标记的折线.
我需要用折线连接多个标记,也欢迎使用任何其他代码.
I tried this code but no luck with polylines,may be because of small issue, i couldn't get polylines that connect the markers.
I need to connect multiple marker with polylines any alternative code also is welcome.
var locations = [];
// call php array
var latitude = <?php echo json_encode($latitude); ?>;
var longitude = <?php echo json_encode($longitude); ?>;
for(var i=0;i<20;i++){
locations.push(["current",latitude[i], longitude[i]]);
}
var marker;
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: new google.maps.LatLng(12.289774217827633, 76.30976921188685)
});
var flightPath = new google.maps.Polyline({
path: locations,
geodesic: true,
strokeColor: '#000000',
strokeOpacity: 1.0,
strokeWeight: 3
});
flightPath.setMap(map);
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
推荐答案
flightPath应该作为数组调用.
flightPath should be called as an array.
请尝试使用此更新的代码.
Please try this updated code.
var locations = [
];
// call php array
var latitude = <?php echo json_encode($latitude); ?>;
var longitude = <?php echo json_encode($longitude); ?>;
for(var i=0;i<20;i++){
locations.push(["current",latitude[i], longitude[i]]);
}
var marker;
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: new google.maps.LatLng(12.289774217827633, 76.30976921188685)
});
// locations.push(["current",test2, test3]);
var infowindow = new google.maps.InfoWindow();
var marker, i;
var flightPlanCoordinates = [];
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
flightPlanCoordinates.push(marker.getPosition());
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
var flightPath = new google.maps.Polyline({
map: map,
path: flightPlanCoordinates,
strokeColor: "#ff0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
}
这篇关于用折线连接多个标记的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文