The result is giving me this error: "TypeError: marker.getPosition is not a function".
I Did multiple search about the markerClustering but couldn't find any explanation for error!
My variable myMarkers is an array as asked in the documentation of MarkerClusterer.
If someone could help me, it would be much apreciated :)
function initMap(){
var maDataBase = [];
var myMarkers = [];
$.getJSON( "https://api.jcdecaux.com/vls/v1/stations?contract=MY-CONTRACT&apiKey=MY-API-KEY", function( data ) {
$.each( data, function( key, val ) {
maDataBase.push(val);
});
}).done(function(){
var bounds = new google.maps.LatLngBounds();
var myMap = $('.main')[0];
var mapOptions = {
mapTypeId : google.maps.MapTypeId.ROADMAP
};
var googleMap = new google.maps.Map(myMap, mapOptions);
for (var i = 0; i < 50; i++){
myMarkers.push(new google.maps.LatLng(maDataBase[i].position.lat, maDataBase[i].position.lng));
for (var x = 0, marker; x < myMarkers.length;x++){
bounds.extend(myMarkers[i]);
marker = new google.maps.Marker({
map : googleMap,
position: myMarkers[i],
});
}
};
googleMap.fitBounds(bounds);
var markerCluster = new MarkerClusterer(googleMap, myMarkers,{imagePath: '../img/m'});
});
};
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>JCDecaux</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
</head>
<body>
<div class="main" id="main">
</div>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=MY-API-KEY&callback=initMap"></script>
<script src="js/markerclusterer.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>
myMarkers isn't an array of google.maps.Markers. The entries don't have a getPosition method. Save the google.maps.Marker objects you create in an array and add that to the MarkerClusterer.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With