MarkerCluster谷歌地圖不是我的分組標記

Question

首先我得到JSON //工作

JSON結構站的位置：

[{"number":31705,"name":"31705 - CHAMPEAUX (BAGNOLET)","address":"RUE DES CHAMPEAUX (PRES DE LA GARE ROUTIERE) - 93170 BAGNOLET","position":{"lat":48.8645278209514,"lng":2.416170724425901},"banking":true,"bonus":true,"status":"OPEN","contrat _name":"Paris","bike_stands":50,"available_bike_stands":45,"available_bikes":5,"last_update":1416677110000}] 

其次我想分組標記與MarkerCluster但MarkerCluster在所有我marker
爲什麼它不是分組？

function initialize() { 

    var mapOptions = { 
    center: new google.maps.LatLng(48.859875, 2.342253), 
    zoom: 13, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    disableDefaultUI: true 
    }; 

    var infoWindow = new google.maps.InfoWindow(); 
    var mcOptions = {gridSize: 50, maxZoom: 15, minimumClusterSize:10} 

    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    $.getJSON("https://api.jcdecaux.com/vls/v1/stations?contract=Paris&apiKey=d98a9b59f1d1999cf1ab909051cc63bd46c66a46", function (data) { 
    $.each(data, function (key, data) { 

     var markers = []; 

     for (var i = 0, length = data.address.length; i < length; i++) { 
     var myLatlng = new google.maps.LatLng(data.position.lat, data.position.lng); 
     var marker = new google.maps.Marker({ 
      position: myLatlng 
     }); 

     markers.push(marker); 
     } 

     var markerCluster = new MarkerClusterer(map, markers, mcOptions); 

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

Answer 1

您正在爲每個標記一個新的MarkerClusterer（如果你縮進代碼更容易看到）

• 移動MarkerCluster的創造出來的。每$的。

也：

• 招google.maps.event.addDomListener(window,'load',initialize);出來的初始化函數
• 去除data.address.length內環（除非它是由您的數據所需的，沒有看所有您的數據）

function initialize() { 

    var mapOptions = { 
    center: new google.maps.LatLng(48.859875, 2.342253), 
    zoom: 13, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    disableDefaultUI: true 
    }; 

    var infoWindow = new google.maps.InfoWindow(); 
    var mcOptions = { 
    gridSize: 50, 
    maxZoom: 15, 
    minimumClusterSize: 10 
    }; 

    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    $.getJSON("https://api.jcdecaux.com/vls/v1/stations?contract=Paris&apiKey=d98a9b59f1d1999cf1ab909051cc63bd46c66a46", function (data) { 
    $.each(data, function (key, data) { 
     var myLatlng = new google.maps.LatLng(data.position.lat, data.position.lng); 
     var marker = new google.maps.Marker({ 
     position: myLatlng 
     }); 
     markers.push(marker); 
    }); 
    var markerCluster = new MarkerClusterer(map, markers, mcOptions); 
    }); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 

working fiddle（修改你的數據子集）