2016-08-01 2 views
-1

In der letztgenannten Teil einer Liste von Geschäften über Google Maps API v3 Aufbau und ich bin in diesen Fehler ausgeführt wird, nachdem die Seitenleiste Aufbau und Anwendung eines Zuhörers zu bewegen und öffnen Sie das Infofenster:Google Maps v3 Sidebar Links

Uncaught TypeError: Cannot read property '__e3_' of undefined 

Hier ist mein javascript:

$(document).ready(function() { 

    var map; 

    function launchInfoWindow(x) { 
     google.maps.event.trigger(gmarkers[x], "click"); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 

    // if a zipcode is entered 
    $('#zipcode').submit(function() { 

     // clear the results first 
     $('#list-results').empty(); 

     // find the new results 
     geoLocateZip($('#zip').val()); 
     return false; 
    }); 

}); 

function initialize() { 
    var mapOptions = { 
     zoom: 13, 
     draggable: true, 
     center: new google.maps.LatLng(33.5725815, -112.01186689999997), 
    }; 

    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    if (navigator.geolocation) { 
     function success(pos) { 
      userCords = pos.coords; 
      getResults(userCords.latitude, userCords.longitude); 
     } 
     navigator.geolocation.getCurrentPosition(success); 
    } 
} 

function geoLocateZip(zipcode) { 
    $.ajax({ 
     type: 'GET', 
     url: 'https://maps.googleapis.com/maps/api/geocode/json', 
     dataType: 'json', 
     data: { 
      address: zipcode 
     }, 
     success: function(data) { 
      var lat = data.results[0].geometry.location.lat; 
      var lng = data.results[0].geometry.location.lng; 
      getResults(lat, lng); 
     } 
    }); 
} 

function getResults(lat, lng) { 
    $.ajax({ 
     type: 'GET', 
     url: 'https://www.arizonalottery.com/FeedService/v1/retaillocations', 
     dataType: 'json', 
     data: { 
      lat: lat, 
      lon: lng, 
      dist: '250', 
      limit: 20 
     }, 
     success: function(data) { 

      var endpoints = []; 
      for (x in data) { 
       endpoints.push(data[x]); 
      } 

      var bounds = new google.maps.LatLngBounds(); 
      for (i = 1; i < endpoints.length; i++) { 
       markers(endpoints[i], bounds, i); 
       var latlng = new google.maps.LatLng(endpoints[i]['latitude'], endpoints[i]['longitude']); 
       bounds.extend(latlng); 
      } 

     } 
    }); 
} 

function markers(loc, bounds) { 
    var activeInfoWindow; 
    var gmarkers = []; 
    var marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(loc.latitude, loc.longitude), 
    }); 

    marker.setMap(map); 
    map.fitBounds(bounds); 

    // create infoWindow 
    var infoWindow = new google.maps.InfoWindow(); 
    var name = loc.displayName; 
    var address = loc.streetAddress; 
    var dirLink = 'daddr=' + loc.latitude + ',' + loc.longitude; 
    var distance = parseFloat(loc.distance).toFixed(2); 

    $('#list-results').append(
     '<li data-id="' + i + '">' + 
     '<h2>' + name + '</h2>' + 
     '<p>' + address + '</p>' + 
     '<p>Distance: ' + distance + ' Miles</p>' + 
     '<a href="https://maps.google.com?' + dirLink + '" target="_blank">Get Directions</a>' + 
     '</li>' 
    ); 

    infoWindow.setContent(
     '<div class="markerPop">' + 
     '<h1>' + name + '</h1>' + 
     '<p><span class="address">' + address + '</span>' + 
     '<br /><span class="distance">Distance: ' + distance + ' Miles</span></p>' + 
     '<p><a href="https://maps.google.com?' + dirLink + '" target="_blank">Get Directions</a></p>' + 
     '</div>' 
    ); 

    gmarkers.push(marker); 

    marker.addListener('click', function() { 
     console.log(marker); 
     infoWindow.open(map, marker); 
     activeInfoWindow = infoWindow; 
    }); 

    $('#list-results li').on('click', function(event) { 
     var myMarker = $(this).attr('data-id'); 
     google.maps.event.trigger(markers[myMarker], 'click'); 
    }); 
} 

Jede Hilfe auf diesem würde immens

+0

Geben Sie eine [mcve] an, die das Problem einschließlich des erforderlichen HTML/CSS veranschaulicht. – geocodezip

Antwort

0

Bewegen Sie den Hörer in die initializer Funktion geschätzt.

+0

Wenn ich den Listener in meine 'initialize()' Funktion verschoben habe, ist der Fehler, den ich bekomme: 'marker is not defined' weil er nach 'marker' aus der Schleife innerhalb der' markers()' Funktion sucht – Eddie