How to use @igo2/geo - 10 common examples

private tryAddFeatureToMap(layer: SearchResult) {
    if (layer.meta.dataType !== FEATURE) {
      return undefined;
    }

    // Somethimes features have no geometry. It happens with some GetFeatureInfo
    if (layer.data.geometry === undefined) {
      return;
    }

    this.map.overlay.setFeatures(
      [layer.data] as Feature[],
      FeatureMotion.Default
    );
  }

private tryAddFeatureToMap(result: SearchResult) {
    if (result.meta.dataType !== FEATURE) {
      return undefined;
    }
    const feature = (result as SearchResult).data;

    // Somethimes features have no geometry. It happens with some GetFeatureInfo
    if (feature.geometry === undefined) {
      return;
    }

    this.map.overlay.setFeatures([feature], FeatureMotion.Default);
  }

constructor(
    private mapService: MapService,
    private projectionService: ProjectionService  // Don't remove this or it'll never be injected
  ) {
    this._map = new IgoMap({
      controls: {
        scaleLine: true,
        attribution: {
          collapsed: true
        }
      }
    });

    this.mapService.setMap(this.map);
  }
}

featureTypes: 'vg_observation_v_autre_wmst',
        fieldNameGeometry: 'geometry',
        maxFeatures: 10000,
        version: '2.0.0',
        outputFormat: 'geojson',
        outputFormatDownload: 'SHP' // based on service capabilities
      },
      sourceFields: [
        { name: 'code_municipalite', alias: '# de la municipalitée' },
        { name: 'date_observation', excludeFromOgcFilters: true },
        { name: 'urgence', values: ['immédiate', 'inconnue'] }
      ],
      ogcFilters: {
        enabled: true,
        editable: true,
        allowedOperatorsType: OgcFilterOperatorType.All,
        filters: {
          logical: 'Or',
          filters: [
            {
              operator: 'PropertyIsEqualTo',
              propertyName: 'code_municipalite',
              expression: '10043'
            },
            {
              operator: 'Intersects',
              geometryName: 'the_geom',
              wkt_geometry: `MULTIPOLYGON(((
              -8379441.158019895 5844447.897707146,
              -8379441.158019895 5936172.331649357,
              -8134842.66750733 5936172.331649357,
              -8134842.66750733 5844447.897707146,

ngOnInit() {
    const loadingStrategy = new FeatureStoreLoadingStrategy({});
    this.store.addStrategy(loadingStrategy);

    const selectionStrategy = new FeatureStoreSelectionStrategy({
      map: this.map,
      motion: FeatureMotion.Default
    });
    this.store.addStrategy(selectionStrategy);

    this.store.load([
      {
        meta: { id: 1 },
        type: 'Feature',
        geometry: {
          type: 'Point',
          coordinates: [-72, 47.8]
        },
        projection: 'EPSG:4326',
        properties: {
          id: 1,
          name: 'Name 1',
          description: 'Description 1'

ngOnInit() {
    const loadingStrategy = new FeatureStoreLoadingStrategy({});
    this.store.addStrategy(loadingStrategy);

    const selectionStrategy = new FeatureStoreSelectionStrategy({
      map: this.map,
      motion: FeatureMotion.Default
    });
    this.store.addStrategy(selectionStrategy);

    this.store.load([
      {
        meta: { id: 1 },
        type: 'Feature',
        geometry: {
          type: 'Point',
          coordinates: [-72, 47.8]
        },

ngOnInit() {
    const loadingStrategy = new FeatureStoreLoadingStrategy({});
    this.store.addStrategy(loadingStrategy);

    const selectionStrategy = new FeatureStoreSelectionStrategy({
      map: this.map,
      motion: FeatureMotion.Default
    });
    this.store.addStrategy(selectionStrategy);

    this.store.load([
      {
        meta: { id: 1 },
        type: 'Feature',
        geometry: {
          type: 'Point',
          coordinates: [-72, 47.8]
        },
        projection: 'EPSG:4326',
        properties: {
          id: 1,

zoomToFeatureExtent() {
    if (this.feature.geometry) {
      const olFeature = this.format.readFeature(this.feature, {
        dataProjection: this.feature.projection,
        featureProjection: this.map.projection
      });
      moveToOlFeatures(this.map, [olFeature], FeatureMotion.Zoom);
    }
  }

handler: () => {
          const olFeature = this.format.readFeature(this.resultSelected$.getValue().data, {
            dataProjection: this.resultSelected$.getValue().data.projection,
            featureProjection: this.map.projection
          });
          moveToOlFeatures(this.map, [olFeature], FeatureMotion.Zoom);
        }
      },

this.resultSelected$.next(result);
    const features = [];
    for (const feature of this.store.all()) {
      feature.data === this.resultSelected$.getValue().data ?
        feature.data.meta.style = this.getSelectedMarkerStyle(feature.data) :
          feature.data.meta.style = this.getMarkerStyle(feature.data);
      features.push(feature.data);
    }
    this.map.overlay.setFeatures(features, FeatureMotion.None);

    if (this.zoomAuto) {
      const olFeature = this.format.readFeature(this.resultSelected$.getValue().data, {
        dataProjection: this.resultSelected$.getValue().data.projection,
        featureProjection: this.map.projection
      });
      moveToOlFeatures(this.map, [olFeature], FeatureMotion.Default);
    }

    this.isResultSelected$.next(true);
    this.initialized = false;
  }