fix(map): Add attributions (OSM and Carto)

libs/feature/map/src/lib/map-context/map-context.model.ts

@@ -20,30 +20,35 @@ export interface MapContextLayerWmsModel {
   type: 'wms'
   url: string
   name: string
+  attributions?: string
 }
 
 export interface MapContextLayerWmtsModel {
   type: 'wmts'
   url: string
   name: string
+  attributions?: string
 }
 
 interface MapContextLayerWfsModel {
   type: 'wfs'
   url: string
   name: string
+  attributions?: string
 }
 
 export interface MapContextLayerOgcapiModel {
   type: 'ogcapi'
   url: string
   name: string
   layerType: 'feature' | 'vectorTiles' | 'mapTiles' | 'record'
+  attributions?: string
 }
 
 interface LayerXyzModel {
   type: 'xyz'
   name?: string
+  attributions?: string
 }
 interface LayerXyzModelWithUrl extends LayerXyzModel {
   url: string
@@ -59,6 +64,7 @@ export type MapContextLayerXyzModel =
 
 interface LayerGeojson {
   type: 'geojson'
+  attributions?: string
 }
 interface LayerGeojsonWithUrl extends LayerGeojson {
   url: string

libs/feature/map/src/lib/map-context/map-context.service.ts

@@ -37,6 +37,7 @@ export const DEFAULT_BASELAYER_CONTEXT: MapContextLayerXyzModel = {
     `https://b.basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}.png`,
     `https://c.basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}.png`,
   ],
+  attributions: `<span>© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, © <a href="https://carto.com/">Carto</a></span>`,
 }
 
 export const DEFAULT_VIEW: MapContextViewModel = {
@@ -87,19 +88,22 @@ export class MapContextService {
             source: new OGCVectorTile({
               url: layerModel.url,
               format: new MVT(),
+              attributions: layerModel.attributions,
             }),
           })
         } else if (layerModel.layerType === 'mapTiles') {
           return new TileLayer({
             source: new OGCMapTile({
               url: layerModel.url,
+              attributions: layerModel.attributions,
             }),
           })
         } else {
           return new VectorLayer({
             source: new VectorSource({
               format: new GeoJSON(),
               url: layerModel.url,
+              attributions: layerModel.attributions,
             }),
             style,
           })
@@ -109,6 +113,7 @@ export class MapContextService {
           source: new XYZ({
             url: 'url' in layerModel ? layerModel.url : undefined,
             urls: 'urls' in layerModel ? layerModel.urls : undefined,
+            attributions: layerModel.attributions,
           }),
         })
       case MapContextLayerTypeEnum.WMS:
@@ -117,6 +122,7 @@ export class MapContextService {
             url: layerModel.url,
             params: { LAYERS: layerModel.name },
             gutter: 20,
+            attributions: layerModel.attributions,
           }),
         })
       case MapContextLayerTypeEnum.WMTS: {
@@ -141,6 +147,7 @@ export class MapContextService {
               tileGrid,
               projection: matrixSet.crs,
               dimensions,
+              attributions: layerModel.attributions,
             })
           )
         })
@@ -166,6 +173,7 @@ export class MapContextService {
                 })
               },
               strategy: bboxStrategy,
+              attributions: layerModel.attributions,
             })
           )
         })

libs/feature/map/src/lib/utils/map-utils.service.ts

@@ -26,6 +26,7 @@ import {
   MapContextLayerWmsModel,
 } from '../map-context/map-context.model'
 import Collection from 'ol/Collection'
+import { defaults as defaultControls } from 'ol/control.js'
 import MapBrowserEvent from 'ol/MapBrowserEvent'
 import { CatalogRecord } from '@geonetwork-ui/common/domain/model/record'
 import { ProxyService } from '@geonetwork-ui/util/shared'
@@ -47,7 +48,10 @@ export class MapUtilsService {
 
   createEmptyMap(): Map {
     return new Map({
-      controls: [],
+      controls: defaultControls({
+        attribution: true,
+        attributionOptions: { collapsible: false },
+      }),
       pixelRatio: 1,
     })
   }