私はこの「go should go」マップを使って場所を読み込んでGoogleマップに追加する必要があります。私のGoogleマップはすべての場所を読み込まない
ズームレベルに応じて互いに近い場合は、クラスタに追加する必要があります。
私の趣旨は、それらをすべてロードしていないということです。何の誤りもないようです。
誰かが助けることができますか?
var locations = [{
lat: 55.674971,
lng: 12.580891
},
{
lat: 55.674971,
lng: 12.4
},
]
$(document).ready(function() {
codeAddress('Odense');
codeAddress('Viborg');
codeAddress('Copenhagen');
codeAddress('Herningvej9, 8330 Brande');
codeAddress('Vestergade 24, 9510 Arden');
codeAddress('Horsens')
codeAddress('Ove Jensens Alle')
})
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
minZoom: 5,
center: {
lat: 56.26392,
lng: 9.501785
}
});
// Create an array of alphabetical characters used to label the markers.
var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
var markers = locations.map(function(location, i) {
return new google.maps.Marker({
position: location,
label: labels[i % labels.length]
});
});
// Add a marker clusterer to manage the markers.
var markerCluster = new MarkerClusterer(map, markers, {
imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
});
}
function codeAddress(address) {
$.ajax({
url: "https://maps.googleapis.com/maps/api/geocode/json?address=" + address + "&key=AIzaSyC6B-a580ktINp36CTzg6x_btYI8e_44r8",
success: function(data) {
//console.log("lat:" + data.results[0].geometry.location.lat + " lng:" + data.results[0].geometry.location.lng + " Adresse = " + address);
locations.push({
"lat": data.results[0].geometry.location.lat,
"lng": data.results[0].geometry.location.lng
})
},
error: function(data) {
}
})
}
$(document).ready(function() {
function reloadMarkers() {
// Loop through markers and set map to null for each
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
}
});
#map {
height: 300px;
width: 300px;
}
/* Optional: Makes the sample page fill the window. */
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js">
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC6B-a580ktINp36CTzg6x_btYI8e_44r8&callback=initMap">
</script>
<div id="map"></div>
私はそれがこのコードは、あなたの問題の完全なソリューションです全9箇所 –