RangeError: превышен максимальный размер стека вызовов - Google Maps Api

Question

У меня есть приложение, которое отображает массив маркеров на картах Google. До недавнего времени я замечал эту ошибку. Что меня смущает, так это то, что я не коснулся кода, который отображает маркеры в то время, и я только сейчас получаю эту ошибку. Карта загружается успешно, но когда нажата кнопка, чтобы показать все маркеры, тогда это означает, что карта пуста, и я получаю ошибку стека вызовов. Появятся какие-нибудь идеи о том, что может вызвать эту ошибку? Я вставлю соответствующий код.

angular.module('mapCtrl',['surfService']) 
    .controller('mapController', function(Surf){ 
    var vm = this; 
    var markers = []; 
    var newMarker = null; 
    var infoWindow = new google.maps.InfoWindow(); 

    // ============================= 
    // Get all Surf Session locations from Ajax Requst 
    // ============================= 
    vm.displaySurfSessions = function(){ 
     //If there are no markers in the array, then display the collection 
     if(markers.length === 0){ 
     Surf.all() 
      .success(function(dataResponse){ 
      //Loop through the database objects 
      for (var i = 0; i < dataResponse.length; i++) { 
       console.log(dataResponse[i]); 
       //Set properties of objects into varibles for later use 
       var title = dataResponse[i].title; 
       var latitude = dataResponse[i].latitude; 
       var longitude = dataResponse[i].longitude; 
       var comment = dataResponse[i].comment; 
       //Set the latitude and longitude 
       var latLng = new google.maps.LatLng(latitude, longitude); 

       //Set a new Marker for each location 
       addMarker(latLng,title,comment); 


      }//End for loop 
      console.log('Markers',markers); 
      });//End success 
     }else { 
      //Marker Must Be Removed 
      vm.removeMarker = "Clear Map First!"; 
     } 

    }; 

    // ============================= 
// Function to Set Markers on locations 
// ============================= 
// Adds a marker to the map and push to the array. 
function addMarker(location,title,comment) { 
    var marker = new google.maps.Marker({ 
    position: location, 
    map: map, 
    title: title, 
    comment: comment 
    }); 
    //Set the Lat & Lng of the new marker to use in saveSurfSession() 
    newMarker = {latitude: marker.position.H , longitude: marker.position.L}; 
    map.panTo(location); 
    console.log('NewMarker',newMarker); 

    //Set the IW Content for each marker 
    var infoWindowContent = 
     "<h2 class='iw-title'>" + marker.title + "</h2>" + 
     "<p class='iw-comment'> " + marker.comment + "</p>" ; 

    //Create a new click event listerner for each marker 
    google.maps.event.addListener(marker, 'click', function(){ 
    infoWindow.setContent(infoWindowContent); 
    infoWindow.open(map,marker); 
    }); 

    //Push the new marker into the markers array 
    markers.push(marker); 
} 

// ============================================= 
// Map 
// ============================================= 
    //Create options for the map 
    var mapOptions = { 
     center: new google.maps.LatLng(37.7831,-122.4039), 
     styles: styles, 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 
    //Create a new google map 
    map = new google.maps.Map(document.getElementById('map'), 
    mapOptions); 


    // This event listener will call addMarker() when the map is clicked. 
    google.maps.event.addListener(map,'click', function(event) { 
     // Allow for one marker to be placed at a time 
     if(markers.length === 0){ 
      addMarker(event.latLng); 
      console.log('Markers',markers); 
     }else { 
      // Tell User to Clear the Map 
      alert('Clear Map'); 
     } 
    }); 

    });//End mapController 

Answer 1

Скорее всего эта ошибка возникает, так как ваши входные данные (dataResponse) содержит недопустимые координаты (широта/значения СПГ).

Вы можете использовать следующие функции для проверки LAT/LNG значения:

var isValidLat = function(val){ 
    return (isNumeric(val) && (val >= -90.0) && (val <= 90.0)); 
} 

var isValidLng = function (val) { 
    return (isNumeric(val) && (val >= -180.0) && (val <= 180.0)); 
} 

var isNumeric = function (n) { 
    return !isNaN(parseFloat(n)) && isFinite(n); 
} 

Затем проверить свои входные данные, как это:

for (var i = 0; i < dataResponse.length; i++) { 
    var latitude = dataResponse[i].latitude; 
    var longitude = dataResponse[i].longitude; 
    if (isValidLat(latitude) && isValidLng(longitude)) { 
     //... 
    }   
} 

Еще одна проблема связана с линией:

newMarker = {latitude: marker.position.H , longitude: marker.position.L}; 

Избегайте использования non public свойств google.maps.LatLng объекта, а предпочитает .lat() и .lng() функции для получения лат/значение LNG:

newMarker = {latitude: marker.position.lat() , longitude: marker.position.lng()};