CODEWITHSUNDEEP
openlayers
A. Pace
A. Pace

Reputation: 45

How can I enumerate the features in a clustered map?

I am developing a clustered map based on the openlayer clustered features. I am handling the event when the user click on the cluster but I am unable to get at the properties of the cluster the user has clicked on.

My question: When the user clicks on the cluster, how can I enumerate the features that are in the cluster and access their properties ?

My code looks something like:

var source = new VectorSource({
        features: features  //here are my features
});

var clusterSource = new Cluster({
        distance: 20,
        source: source
});

var clusters = new VectorLayer({
        source: clusterSource,
        style: function(feature) { ... }
});

var raster = new TileLayer({
        source: new OSM()
});

var map = new Map({
        layers: [raster, clusters],
        target: 'map',
        view: new View({ center: [0, 0], zoom: 2})
});

map.on('click', function(event) {
    map.forEachFeatureAtPixel(event.pixel, function(feature,layer) {
        alert('found feature');
        // here I am stuck. How can I access the properties in the features of the cluster ?
    });
});

Upvotes: 0

Views: 79

Answers (1)

A. Pace
A. Pace

Reputation: 45

Thanks to mike, here is the code that works:

map.on('click', function(event) {
    map.forEachFeatureAtPixel(event.pixel, function(feature,layer) {
        alert('found feature');
        var Clusters = feature.getProperties();
        var NumberOfFeaturesInCluster = Clusters.features.length

        //example of extracting and concatenating a property called 'name'
        var listofnames = ''
        for (i = 0; i < NumberOfFeaturesInCluster; i++) {
          listofnames += ", " + Clusters.features[i].getProperties().name;
        }

    });
});

Upvotes: 1

Related Questions