2014-11-13 47 views
0

我有一個簡單的代碼和一個簡單的地圖,添加了一些功能並將它們集中在一起。直接從例子:如何選擇openlayers中集羣層的所有功能3

var vectorSource = new ol.source.Vector({ 
     projection: 'EPSG:4326' 
    }); 

    var clusterSource = new ol.source.Cluster({ 
     distance: 30, 
     source: vectorSource 
    }); 

    var styleCache = {}; 
    var clusters = new ol.layer.Vector({ 
     source: clusterSource, 
     style: function(feature, resolution) { 
     var size = feature.get('features').length; 
     var style = styleCache[size]; 
     var src; 
     if (!style) { 
      if(size == 1){ 
       src = 'images/location-single.png'; 
      }else{ 
       src = 'images/location-multi.png'; 
      } 
      style = [ 
      new ol.style.Style({ 
       image: new ol.style.Circle({ 
        radius: 5, 
        fill: new ol.style.Fill({ 
        color: '#5bc0de' 
        }) 
       }) 
      }), 
      new ol.style.Style({ 
       image: new ol.style.Icon(({ 
        // scale: 1 + rnd, 
        // rotateWithView: (rnd < 0.9) ? true : false, 
        // rotation: 360 * rnd * Math.PI/180, 
        anchor: [0.45, 1], 
        anchorXUnits: 'fraction', 
        anchorYUnits: 'fraction', 
        // opacity: rnd, 
        src: src 
       })), 
       text: new ol.style.Text({ 
        text: size.toString(), 
        fill: new ol.style.Fill({ 
        color: '#000' 
        }) 
       }) 
      }) 

      ]; 
      styleCache[size] = style; 
     } 
     return style; 
     } 
    }); 


    var map = new ol.Map({ 
     target: 'map', // The DOM element that will contains the map 
     renderer: 'canvas', // Force the renderer to be used 
     layers: [ 
      // Add a new Tile layer getting tiles from OpenStreetMap source 
      new ol.layer.Tile({ 
       source: new ol.source.OSM() 
      }), 
      clusters 
     ], 
     // Create a view centered on the specified location and zoom level 
     view: new ol.View({ 
      center: ol.proj.transform([2.1833, 41.3833], 'EPSG:4326', 'EPSG:3857'), 
      zoom: 6 
     }) 
    }); 

現在我得到了集羣功能正常工作。但是我需要爲集羣中的每個點顯示座標,我嘗試過使用map.forEachFeatureAtPixel,但它確實爲集羣中的所有功能提供了工作。我如何選擇全部?

回答

0

哦。我想我明白了!一個集羣是一個功能,並得到它的屬性。

map.on('singleclick', function(event) { 
    map.forEachFeatureAtPixel(event.pixel, function(feature) { 
     var featuresInCluster = feature.getProperties().features; 
    }); 
}); 

但我真的想知道是否有另一種方式:所以我們可以通過使用.getProperties()

在GET集羣中的所有功能?

+0

'feature.get('features')'比'feature.getProperties()。features'更直接 – nachtigall