Невозможно прочитать свойство '__e3_' неопределенного

Question

Видимо, некоторые из этих ошибок усеяны здесь, но, взглянув на ответы, я еще не нашел решение, которое работает здесь. Все, кажется, работает хорошо, пока я не добавить в EventListener для щелчка, чтобы открыть в InfoWindow, который, когда я получаю следующее сообщение об ошибке в консоли:

Не удается прочитать свойство «__e3_» неопределенной

Любые идеи относительно того, что вызывает эту ошибку?

Обратите внимание, что я далек от эксперта в использовании Google Maps, поэтому имейте это в виду любые ответы :)

<div class="acf-map c-location-map" style="width: 100%; height: 700px;"> 
    <?php 

     // Get a list of all offices, we need their IDs to get their locations for use with the Google map. 
     $stockistList = get_posts(array(
      'posts_per_page' => -1, 
      'post_type'   => 'stockist', 
     )); 

     if (!empty($stockistList))   
     { 
      foreach ($stockistList as $singleStockist) 
      { 
       // Create a simple div that shows the map working correctly. 
       printf('<div class="c-location-map__marker marker" data-country="%s"> 
          <h4>%s</h4> 
         </div>', 
         get_field('stockist_country', $singleStockist->ID), 
         $singleStockist->post_title 
        ); 
      } 
     } 
    ?> 
<!-- .c-location-map --></div> 

<script type="text/javascript"> 
(function($) { 

/** 
* Creates a new Google Map using the markers on the page. 
*/ 
function ts_newMap($el) 
{ 
    var $markers = $el.find('.marker'); 

    // Settings 
    var args = { 
     zoom    : 3, 
     center    : new google.maps.LatLng(0, 0), 
     mapTypeId   : google.maps.MapTypeId.ROADMAP, 
     scrollwheel   : false, 
     styles    : [{"featureType":"all","elementType":"all","stylers":[{"visibility":"simplified"}]},{"featureType":"all","elementType":"geometry","stylers":[{"color":"#0025f0"}]},{"featureType":"all","elementType":"geometry.fill","stylers":[{"visibility":"simplified"},{"color":"#2d3a6d"}]},{"featureType":"all","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"all","elementType":"labels.text.fill","stylers":[{"gamma":0.01},{"lightness":20}]},{"featureType":"all","elementType":"labels.text.stroke","stylers":[{"saturation":-31},{"lightness":-33},{"weight":2},{"gamma":0.8}]},{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"administrative.country","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"administrative.province","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"administrative.locality","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"administrative.neighborhood","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"administrative.land_parcel","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"lightness":30},{"saturation":30},{"visibility":"simplified"},{"color":"#636363"}]},{"featureType":"landscape","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi","elementType":"all","stylers":[{"color":"#636363"}]},{"featureType":"poi","elementType":"geometry","stylers":[{"saturation":20}]},{"featureType":"poi","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi.park","elementType":"geometry","stylers":[{"lightness":20},{"saturation":-20}]},{"featureType":"road","elementType":"all","stylers":[{"visibility":"simplified"},{"color":"#636363"}]},{"featureType":"road","elementType":"geometry","stylers":[{"lightness":10},{"saturation":-30}]},{"featureType":"road","elementType":"geometry.stroke","stylers":[{"saturation":25},{"lightness":25}]},{"featureType":"road","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"simplified"},{"color":"#636363"}]},{"featureType":"transit","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"all","stylers":[{"lightness":-20},{"visibility":"simplified"},{"color":"#efefed"}]},{"featureType":"water","elementType":"labels","stylers":[{"visibility":"off"}]}] 
    }; 

    // create map    
    var map = new google.maps.Map($el[0], args); 

    // add a markers reference 
    map.markers = []; 

    // add markers 
    $markers.each(function() { 
     ts_newMapMarker($(this), map);  
    }); 

    // Centre the map based on what pins have been added. 
    ts_mapCentre(map); 

    // return 
    return map; 
} 

/** 
* Adds an individual marker to the map. 
*/ 
function ts_newMapMarker($marker, map) 
{ 

    var marker; 

    var dataCountry = $marker.attr('data-country'); 
    console.log("Country: " + dataCountry); 

    geocoder = new google.maps.Geocoder(); 
    function getCountry(country) { 
     geocoder.geocode({ 'address': country }, function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
       map.setCenter(results[0].geometry.location); 
       marker = new google.maps.Marker({ 
        map: map, 
        position: results[0].geometry.location, 
        icon : '<?php bloginfo('template_url'); ?>/assets/images/map-marker.png' 
       }); 
      } else { 
       alert("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
    } 

    map.markers.push(marker); 

    getCountry(dataCountry); 

    // if marker contains HTML, add it to an infoWindow 
    if($marker.html()) 
    { 
     // create info window 
     var infowindow = new google.maps.InfoWindow({ 
      content  : $marker.html() 
     }); 

     // show info window when marker is clicked 
     google.maps.event.addListener(marker, 'click', function() { 
      console.log("open info window"); 
      infowindow.open(map, marker); 
     }); 
    } 

} 

/** 
* Centres the map based on what's been added to it. 
*/ 
function ts_mapCentre(map) 
{ 
    // vars 
    var bounds = new google.maps.LatLngBounds(); 

    // loop through all markers and create bounds 
    $.each(map.markers, function(i, marker) 
    { 
     var latlng = new google.maps.LatLng(marker.position.lat(), marker.position.lng()); 
     bounds.extend(latlng); 
    }); 

    // only 1 marker? 
    if(map.markers.length == 1) 
    { 
     // set center of map 
     map.setCenter(bounds.getCenter()); 
     map.setZoom(8); 
    } 
    else { 
     // fit to bounds 
     map.fitBounds(bounds); 
    } 

} 

/** 
* Build the map now the page is ready. 
*/ 
var map = null; 
$(document).ready(function() 
{ 
    $('.acf-map').each(function() 
    { 
     // create map 
     map = ts_newMap($(this)); 
    }); 
}); 

})(jQuery); 
</script> 

Answer 1

Вызов

geocoder.geocode({ 'address': country }, function(results, status) { .. 

является асинхронным, то есть линия

google.maps.event.addListener(marker, 'click', function() { 

будет называться перед линией

marker = new google.maps.Marker({ .. 

вызывается в вашем ts_newMapMarker. Таким образом, не существует в точке, где вы хотите добавить к нему прослушиватель событий. Вы должны как-то перестраивать свой код, так что вы добавить слушатель после того, как маркер инициализации, например:

function ts_newMapMarker($marker, map) 
{ 

    var marker; 

    var dataCountry = $marker.attr('data-country'); 
    console.log("Country: " + dataCountry); 

    geocoder = new google.maps.Geocoder(); 
    function getCountry(country) { 
     geocoder.geocode({ 'address': country }, function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
       map.setCenter(results[0].geometry.location); 
       marker = new google.maps.Marker({ 
        map: map, 
        position: results[0].geometry.location, 
        icon : '<?php bloginfo('template_url'); ?>/assets/images/map-marker.png' 
       }); 

       map.markers.push(marker); 

       getCountry(dataCountry); 

       // if marker contains HTML, add it to an infoWindow 
       if($marker.html()) 
       { 
        // create info window 
        var infowindow = new google.maps.InfoWindow({ 
         content  : $marker.html() 
        }); 

        // show info window when marker is clicked 
        google.maps.event.addListener(marker, 'click', function() { 
         console.log("open info window"); 
         infowindow.open(map, marker); 
        }); 
       } 
      } else { 
       alert("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
    } 

} 

Answer 2

В моем случае google.maps.event.addListener(marker, 'click', function() { переменный маркера был неопределенным. И, следовательно, ошибка. Может быть полезно для кого-то.