Issue while rendering map style photo in angular.

[tberbalaje]

Circular image rendering using Photo from 'ol-ext/style/Photo' is not working. Even if 4 images are loaded only the last image displayed in all 4 image holders. Below attached code, new Icon works fine but not new Photo

JS reference: https://viglino.github.io/ol-ext/examples/style/map.style.photo.html

new Photo

new Icon

`addCircularImages() {
const map: OlMap = this.mapService.getMap(this.mapidService);

const vectorSource = new VectorSource({
  url: 'assets/paris-1900.geojson',
  format: new GeoJSON(),
});

const clusterLayer = new VectorLayer({
  source: new ClusterSource({
    source: vectorSource,
  }),
  style: (feature) => {
    const size = feature.get('features').length;
    const img = feature.get('features')[0].get('img');
    return new Style({
      image: new Photo({
        src: img,
        radius: 25,
        crop: true,
        kind: size > 1 ? 'folio' : 'circle',
        shadow: 0,
        crossOrigin: 'anonymous',
        declutterMode: 'none',
        onload: () => {
          return true;
        },
        displacement: [0, 0],
        stroke: new Stroke({
          width: 5,
          color: '#fff',
        }),
      }),
      // image: new Icon({
      //   src: feature.get('features')[0].get('img'),
      //   height: 50,
      //   width: 50,
      // }),
      text: new Text({
        text: size > 1 ? size.toString() : '',
        font: 'bold 12px sans-serif',
        fill: new Fill({ color: '#fff' }),
      }),
    });
  },
});
map.addLayer(clusterLayer);

}`

[Viglino]

I you are using ol > 10.13.1 there is a breaking change on symbol cache.
This commit should fix it: 6ea333d
But nor yet deployed on npm.
Can you try to replace the style/photo.js file in the ol-ext directory to test it?

[tberbalaje]

@Viglino this worked, but renderOptions_ is private in ol/style/RegularShape.js

[Viglino]

@Viglino this worked, but renderOptions_ is private in ol/style/RegularShape.js

That's still a hack for 10.13.1 I'll manage to overwrite the createRenderOptions method in the next version...