Angularjs Google Maps API рисования полилинии
Следующий фрагмент кода дает мне вывод как (в основном при каждом клике добавляется новый маркер, и я выбираю его значения lat и long):
0: Latitude: 40.207196906764054 Longitude: -99.68994140625
1: Latitude: 40.202477129519124 Longitude: -99.60823059082031
Фрагмент кода:
$scope.map.markers.push(marker);
// console.log($scope.map.markers);
for (var item in $scope.map.markers) {
console.log(item +': '+ "Latitude: " + $scope.map.markers[item].coords.latitude + " " + "Longitude: " + $scope.map.markers[item].coords.longitude);
}
Чтобы нарисовать ломаную линию, мне нужен массив в таком формате:
var flightPlanCoordinates = [
{lat: 37.772, lng: -122.214},
{lat: 21.291, lng: -157.821},
{lat: -18.142, lng: 178.431},
{lat: -27.467, lng: 153.027}
];
Я в основном хочу нарисовать линии вдоль этих маркеров. Как я могу построить такую структуру внутри моего цикла for, чтобы добавить значения lat и long, которые я могу передать в переменную Path для Polilines?
1 ответ
Решение
Вы должны иметь возможность зацикливать маркеры и добавлять их координаты в пустой массив (при условии, что цикл, который вы показали, работает):
var myCoordinates = [];
for (var item in $scope.map.markers) {
myCoordinates.push({lat: $scope.map.markers[item].coords.latitude, lng: $scope.map.markers[item].coords.longitude});
}
а затем использовать myCoordinates
массив так же, как вы использовали бы flightPlanCoordinates
создать ломаную линию, например:
var myPolyline = new google.maps.Polyline({
path: myCoordinates,
geodesic: true,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 2,
map: map
});