I am currently utilizing the ng-map directive in conjunction with AngularJS. I have implemented the code below to generate markers. I store latitude and longitude values for each marker in an array, much like the examples shown here. Upon inspecting the logs, I can confirm that the information is accurate. However, the markers do not appear on my map.
Below is my AngularJS code:
var app = angular.module('myApp', ['ngMap']);
app.controller('mapController', function($interval, $http) {
var generateMarkers = function() {
var vm = this;
vm.positions = [];
$http.get("data").
success(function(data) {
console.log(data);
console.log("array length: " + data.length);
for (i = 0; i < data.length; i++) {
var lat = parseFloat(data[i].latitud);
var lng = parseFloat(data[i].longitud);
console.log("position: " + lat + lng);
vm.positions.push([lat, lng]);
console.log("vm.positions", vm.positions);
}
}).
error(function (data) {
console.log("failure");
});
};
$interval(generateMarkers, 20000);
});
As for my HTML code:
<ng-map zoom="14" center="[42.8169, -1.6432]" default-style="false">
<marker ng-repeat="p in vm.positions" position="{{p}}"></marker>
</ng-map>
Here are the logged positions:
vm.positions [Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2]]0: Array[2]0: 42.8133161: -1.647981length: 2__proto__: Array[0]1: Array[2]0: 42.811868050589231: -1.635117530822754length: 2__proto__: Array[0]2: Array[2]0: 42.811868050589231: -1.639484167098999length: 2__proto__: Array[0]3: Array[2]0: 42.8139773239805951: -1.6452884674072266length: 2__proto__: Array[0]4: Array[2]0: 42.815834684266571: -1.6393446922302246length: 2__proto__: Array[0]5: Array[2]0: 42.8169010671877861: -1.6428154706954956length: 2__proto__: Array[0]6: Array[2]0: 42.8160038901641541: -1.6477882862091064length: 2__proto__: Array[0]7: Array[2]0: 42.811805086098651: -1.6448163986206055length: 2__proto__: Array[0]8: Array[2]0: 42.8174086747381: -1.6568756103515625length: 2__proto__: Array[0]9: Array[2]0: 42.805945172637361: -1.6659602522850037length: 2__proto__: Array[0]length: 10__proto__: Array[0].....(additional array information)
You can view the plnkr demo here: http://plnkr.co/edit/5uGUeyeuAie0TAFzIHMo?p=preview. This demo closely resembles the provided example but includes a GET Request to retrieve an array of latitudes and longitudes. Note that the updated version of the plnk has removed the GET Request and adjusted the data appropriately.