JQuery Promise + JSON konumlar için Google harita ayarı belirteçleri çalışmıyor

Json dosyasından konum işaretleyicileri çalışıyorum. JQuery Promise kullanıyorum, bu yüzden her ikisi de vaatler (harita başlatma ve json dosyası alma) çözüldüğünde işaretçiler ayarlanır.JQuery Promise + JSON konumlar için Google harita ayarı belirteçleri çalışmıyor

var map; 
var loadMapDeferred = $.Deferred(); 
var allSculptures; 
var locations; 

initMap = function() { 
    map = new google.maps.Map(document.getElementById('map'), { 
     center: {lat: 30, lng: 0}, 
     zoom: 3 
    }); 
    loadMapDeferred.resolve(); 
} 

var urlCDN = 'http://localhost/myproject/uploads/data.json'; 
var loadDataPromise = $.getJSON(urlCDN).then(function(data) { 
    allSculptures = data.sculptures; 
    locations = {}; 
    for(var i=0; i<data.location.length; i++) { 
     locations[data.location[i].name] = data.location[i].location; 
    } 
}); 

$.when(loadMapDeferred, loadDataPromise).then(function() { 
    var markers = _.map(locations, function(location, locationName) { 
     return createMarker(locationName, location); 
    }); 

    var mcOptions = {gridSize: 25}; 
    new MarkerClusterer(map, markers, mcOptions); 
}); 

var currentInfoWindow; 

function createMarker(locationName, location) { 
    var marker = new google.maps.Marker({ 
     position: location 
    }); 

    var infoWindow; 
    marker.addListener('click', function() { 
     if(currentInfoWindow) 
      currentInfoWindow.close(); 
     if(infoWindow == null) { 
      infoWindow = new google.maps.InfoWindow({ 
       content: getCityInfoWindow(locationName) 
      }); 
     } 
     infoWindow.open(map, marker); 
     currentInfoWindow = infoWindow; 
    }); 

    return marker; 
}

Data.JSON

{"sculptures":[{"title":"Bust of Caracalla","location":"Paris"}, 
      {"title":"Brutus The Younger","location":"Paris"}], 
    "location":[{"name":"Beaux-Arts in Dijon, France","location":{"lat":47,"lng":5}}, 
     {"name":"Louvre, Paris","location":{"lat":48,"lng":2}}, 
     {"name":"St Pauls Cathedral, London","location":{"lat":51,"lng":-0}}, 
     {"name":"V&A, London","location":{"lat":51,"lng":-0}}]}

alıyorum haritası, ama yapamıyor: tüm fonksiyonları ile

<head> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js"></script> 
    <script type="text/javascript" src="js/markerclusterer_compiled.js"></script> 
    <script type="text/javascript" src="js/app.js"></script> 
    <script src="https://maps.googleapis.com/maps/api/js?key=mykey&callback=initMap" async defer></script> 
</head> 
<body> 
    <div id="map"></div> 

    <script type="lodash/template" id="infowindow-template" > 
     <% items.forEach(function(item) { %> 
     <p><b><%-item.title%></b>, <%-item.author%></p> 
     <p><%-item.location%></p> 
     <p><a href="https://www.myminifactory.com/object/<%-item.url%>" target="_blank">Get more</a></p> 
     <% }); %> 
    </script> 
</body>

app.js: Ben harita ile Bu html sayfasını kullanıyorum İşaretçileri gör. Neyi yanlış yapıyorum?

kaynak

2016-03-30 bonbon

bunu gibi işaretleri oluştururken:

var marker = new google.maps.Marker({ 
    position: location 
});

Ayrıca haritayı belirtmek gerekir

var marker = new google.maps.Marker({ 
    position: location, 
    map: map 
});

kaynak

2016-03-30 18:07:28 duncan

harita, hala çalışmıyor ( – bonbon

@bonbon olduğunu ekledi createMarker işlevi aslında çağrılan Eğer konsol.log (konum) '' yaparsanız ne alırsınız? 'Bu fonksiyonun içinde? – duncan

tamam, bir sorun var, yaratıcısı bile çağrılmadı bile.JGSON çağrılmasa bile sorun var sanırım – bonbon

JQuery Promise + JSON konumlar için Google harita ayarı belirteçleri çalışmıyor

cevap

İlgili konular