Attribution control support custom (#2413)

maptalks · Sep 5, 2024 · 0c3fcd0 · 0c3fcd0
1 parent cdf38b9
commit 0c3fcd0
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 2 deletions.
diff --git a/src/control/Control.Attribution.ts b/src/control/Control.Attribution.ts
@@ -1,6 +1,7 @@
 import { createEl } from '../core/util/dom';
 import Control, { ControlOptionsType } from './Control';
 import Map from '../map/Map';
+import { isString } from '../core/util';
 
 /**
  * @property {Object} options - options
@@ -14,7 +15,8 @@ const options: AttributionOptionsType = {
         'bottom': 0,
         'left': 0
     },
-    'content': '<a href="http://maptalks.org" target="_blank">maptalks</a>'
+    'content': '<a href="http://maptalks.org" target="_blank">maptalks</a>',
+    'custom': false
 };
 
 const layerEvents = 'addlayer removelayer setbaselayer baselayerremove';
@@ -58,6 +60,16 @@ class Attribution extends Control {
         return this._attributionContainer;
     }
 
+    getContent() {
+        return this.options.content;
+    }
+
+    setContent(content: string | HTMLElement) {
+        this.options.content = content;
+        this._update();
+        return this;
+    }
+
     onAdd() {
         this.getMap().on(layerEvents, this._update, this);
     }
@@ -66,8 +78,28 @@ class Attribution extends Control {
         this.getMap().off(layerEvents, this._update, this);
     }
 
+    //@internal
+    _updateContent() {
+        const container = this._attributionContainer;
+        const content = this.options.content || '';
+        if (container) {
+            //clear
+            container.innerHTML = '';
+            if (isString(content)) {
+                container.innerHTML = content;
+            } else if (content instanceof HTMLElement) {
+                container.appendChild(container);
+            }
+        }
+        return this;
+    }
+
     //@internal
     _update() {
+        if (this.options.custom) {
+            this._updateContent();
+            return;
+        }
         const map = this.getMap();
         if (!map) {
             return;
@@ -99,5 +131,6 @@ Map.addOnLoadHook(function () {
 export default Attribution;
 
 export type AttributionOptionsType = {
-    content?: string;
+    content?: string | HTMLElement;
+    custom?: boolean;
 } & ControlOptionsType;
diff --git a/src/layer/Layer.ts b/src/layer/Layer.ts
@@ -688,6 +688,14 @@ class Layer extends JSONAble(Eventable(Renderable(Class))) {
             if (renderer && renderer.setToRedraw) {
                 renderer.setToRedraw();
             }
+            //auto update attribution control
+            if ('attribution' in conf) {
+                const map = this.getMap();
+                if (map && map.attributionControl && map.attributionControl._update) {
+                    map.attributionControl._update();
+                }
+            }
+
         }
     }
 

diff --git a/src/map/Map.ts b/src/map/Map.ts
@@ -29,6 +29,7 @@ import { computeDomPosition, MOUSEMOVE_THROTTLE_TIME } from '../core/util/dom';
 import EPSG9807, { type EPSG9807ProjectionType } from '../geo/projection/Projection.EPSG9807.js';
 import { AnimationOptionsType, EasingType } from '../core/Animation';
 import { BBOX, bboxInBBOX, getDefaultBBOX, pointsBBOX } from '../core/util/bbox';
+import { Attribution } from '../control';
 
 const TEMP_COORD = new Coordinate(0, 0);
 const TEMP_POINT = new Point(0, 0);
@@ -261,6 +262,7 @@ export class Map extends Handlerable(Eventable(Renderable(Class))) {
     options: MapOptionsType;
     static VERSION: string;
     JSON_VERSION: '1.0';
+    attributionControl?: Attribution;
 
 
     /**