Jquery UI地图集群标记没有显示

jquery ui map clusterer markers aren't displayed

本文关键字：显示 UI 地图集 Jquery      更新时间：2023-09-26

我正在使用jquery ui map，我正在从geoJSON中加载标记，然后我想将它们聚集在一起，但我可以看到标记，但不能聚集。

我的代码如下: <>以前美元("# map_tracks")。gmap({"中心":"45.752051、6.295604","变焦":12})。Bind ('init'， function(ev, map) {$ (' # choose_sentiers ') .change(函数(){Var selected = $('#choose_sentiers').val();$ (" # map_tracks")。gmap('loadKML'， 'sentier'， 'http://example.org/media/kml/sentiers_vtt_randos/'+selected+'.kml');美元。getJSON("标记。， function(data) {美元。每个(data["features"]， function(key, val) {Var longitude = val["geometry"]["coordinates"][0];Var latitude = val["geometry"]["coordinates"][1];var nom = val["properties"][" nom "];var type = val["properties"][" type "];$ (" # map_tracks")。gmap (addMarker, {'position':新的google.maps。LatLng(经度、纬度)() {}) .click(功能$ (" # map_tracks")。gmap('openInfoWindow'， {'content': nom}， this);});});});});$ (" # map_tracks")。gmap('set'， 'MarkerClusterer'，新建MarkerClusterer(map， $(this))。gmap("得到"、"标记")));}); 之前

当我执行console.log($(this)。gmap("得到"、"标记"));它是空的，我不明白它为什么会那样。

你有主意了吗?

谢谢

我已经找到了一个方法来修复它:

var markercluster;
 $('#map_tracks').gmap({ 'center': '45.752051,6.295604', 'zoom': 12 }).bind('init', function(ev, map) {
 $('#choose_tracks').change(function() {
  var selected = $('#choose_tracks').val();      
  if ( selected != 'none' )
  {       
    $("#map_tracks").gmap('clear', 'overlays');
    $('#map_tracks').gmap('loadKML', 'sentier', 'http://mynicesite.com/media/kml/'+selected+'.kml');
    $.getJSON( "http://mynicesite.com/media/geojson/sentiers_poi/"+selected+".geojson").done(function( data ) {
      if ( markercluster != undefined )
      {
        markercluster.clearMarkers();
      }
      $.each( data["features"], function( key, val ) {
        var longitude = val["geometry"]["coordinates"][0];
        var latitude = val["geometry"]["coordinates"][1];
        var nom = val["properties"]["NOM"];
        var type = val["properties"]["TYPE"];
        $('#map_tracks').gmap('addMarker', { 
                  'position': new google.maps.LatLng(latitude, longitude),
          'icon':'http://mynicesite.com/media/kml/'+markersIcons[type]['name']
              }).click(function() {
                  $('#map_tracks').gmap('openInfoWindow', { 'content': nom }, this);
              });    
      });
      markercluster = new MarkerClusterer(map, $('#map_tracks').gmap('get', 'markers'));
      $('#map_tracks').gmap('set', 'MarkerClusterer', markercluster);  
    });
    drawPath(selected);        
  }   
 });    
});
相关文章：