Openlayers 3 - different style/marker for each point on a MultiPoint feature

Question

I have a MultiPoint feature with the following geo json.

{
    "type": "Feature",
    "geometry": {
        "type": "MultiPoint",
        "coordinates": [
            [
                -123,
                58
            ],
            [
                -152.32,
                17.5
            ],
            [
                52.02,
                42.64
            ]
        ]
    }
}

When I draw this on map and apply any icon through a style function, its applied for all points.But I would like to show all 3 coordinates above with different icons on map. Is there any way I can add different markers for each coordinates in a Multipoint feature?

Answer 1

To apply different style for different coordinates in MultiPoint need to write different styles for each coordinate. I have created a view in plunker. Go through the code in this link

new ol.style.Style({
    image: new ol.style.Circle({
      radius: 5,
      fill: new ol.style.Fill({
        color: 'orange'
      })
    }),
    geometry: function(feature) {
      var coordinates = feature.getGeometry().getCoordinates();
      return new ol.geom.Point(coordinates[0]);
    }
  })

In the geometry function consider a single coordinate and apply style for it.

Note: If MultiPoint has more number of points the code will be bloated.