tg-map-core 4.1.7 → 4.2.0

package/dist/tg-map-core.mjs

@@ -1529,6 +1529,14 @@ class TalksEventTargetDelegate extends AbstractEventTargetDelegate {
         'center-changed': 'movestart moving moveend zoomend',
         'zoom-changed': 'zoomend',
     });
+    eventTypeMap;
+    /**
+     * @param eventTypeMap 额外的事件类型映射
+     */
+    constructor(inner, coordTypeSupplier, eventTypeMap) {
+        super(inner, coordTypeSupplier);
+        this.eventTypeMap = { ...TalksEventTargetDelegate.EVENT_TYPE_MAP, ...eventTypeMap };
+    }
     addEventListener(type, listener) {
         const key = generateEventKey(type, listener);
         if (this.eventMap.has(key)) {
@@ -1546,14 +1554,14 @@ class TalksEventTargetDelegate extends AbstractEventTargetDelegate {
             }
             listener.call(this.target, ev);
         };
-        this.inner.on(TalksEventTargetDelegate.EVENT_TYPE_MAP[type] ?? type, actualListener);
+        this.inner.on(this.eventTypeMap[type] ?? type, actualListener);
         this.eventMap.set(key, actualListener);
     }
     removeEventListener(type, listener) {
         const key = generateEventKey(type, listener);
         const actualListener = this.eventMap.get(key);
         if (actualListener) {
-            this.inner.off(TalksEventTargetDelegate.EVENT_TYPE_MAP[type] ?? type, actualListener);
+            this.inner.off(this.eventTypeMap[type] ?? type, actualListener);
             this.eventMap.delete(key);
         }
         else {
@@ -7629,6 +7637,12 @@ class BaseMap {
     removeOverlayMapType(mapType) {
         this.removeLayer(mapType);
     }
+    addOverlay(overlay) {
+        overlay.addTo(this);
+    }
+    removeOverlay(overlay) {
+        overlay.remove();
+    }
     addControl(control) {
         control.addTo(this);
     }
@@ -7665,9 +7679,6 @@ class Overlay {
     removeEventListener(type, listener) {
         this.delegate.removeEventListener(type, listener);
     }
-    remove() {
-        this.map.removeOverlay(this);
-    }
 }
 class GoogleOverlay extends Overlay {
     map;
@@ -7678,6 +7689,13 @@ class GoogleOverlay extends Overlay {
     createDelegate() {
         return new GoogleEventTargetDelegate(this.innerOverlay, this.map);
     }
+    addTo(map) {
+        this.map = map;
+        this.innerOverlay.setMap(map.innerMap);
+    }
+    remove() {
+        this.innerOverlay.setMap(null);
+    }
     isVisible() {
         return this.innerOverlay.getVisible();
     }
@@ -7694,6 +7712,13 @@ class BaiduOverlay extends Overlay {
     createDelegate() {
         return new BaiduEventTargetDelegate(this.innerOverlay, this.map);
     }
+    addTo(map) {
+        this.map = map;
+        this.map.innerMap.addOverlay(this.innerOverlay);
+    }
+    remove() {
+        this.map.innerMap.removeOverlay(this.innerOverlay);
+    }
     /** 仅限内部使用; 设为private时, 生成的d.ts文件中, 方法返回值会变成any, 故改成了public */
     get overlay() {
         // 这几个属性被声明成可选的, 这里将其强转成必选
@@ -7803,11 +7828,43 @@ class GoogleShape extends GoogleOverlay {
     }
 }
 class TalksShape extends TalksOverlay {
+    addTo(map) {
+        this.map = map;
+        this.map.overlayLayer.addGeometry(this.innerOverlay);
+        // 添加到地图中之后, startEdit()才有效
+        if (this.isEditable() && !this.innerOverlay.isEditing()) {
+            this.innerOverlay.startEdit();
+        }
+    }
+    remove() {
+        this.map.overlayLayer.removeGeometry(this.innerOverlay);
+    }
+    /**
+     * ## 编辑状态的映射
+     * tg-map的editable, 直接表示是否处于编辑状态
+     * talks的editable, 只是标记overlay是否可以编辑(默认为true), 要进入编辑状态(isEditing), 还需要执行startEdit()
+     * 也就是说我们需要想办法把talks的四个状态, 映射为tg-map的两个状态
+     *
+     * 我们的做法是, 用editable保存isEditing期望的值, 保证editable为true时isEditing也会为true, 为false时isEditing也会为false
+     * 这样就可以和tg-map的editable的语义简单对应上了
+     *
+     * @see addTo
+     * @see setEditable
+     */
     isEditable() {
-        return this.innerOverlay.config().editable ?? true;
+        return this.innerOverlay.config().editable ?? false;
     }
     setEditable(editable) {
+        // 同步设置editable和isEditing
+        // TODO: 2026/01/23 ipcjs 切换编辑状态时, 控制台会报重复注册事件警告, 已提PR: https://github.com/maptalks/maptalks.js/pull/2796
         this.innerOverlay.config({ editable: editable });
+        const isEditing = this.innerOverlay.isEditing();
+        if (editable) {
+            !isEditing && this.innerOverlay.startEdit();
+        }
+        else {
+            isEditing && this.innerOverlay.endEdit();
+        }
     }
     setStrokeColor(color) {
         this.innerOverlay.updateSymbol({ lineColor: color });
@@ -7977,6 +8034,41 @@ class TalksCircle extends TalksShape {
         });
         return new TalksCircle(inner, coord, this);
     }
+    prevCenter;
+    prevRadius;
+    eventHubDelegate;
+    createDelegate() {
+        return (this.eventHubDelegate = new EventHubEventTargetDelegate(super.createDelegate(), {
+            types: ['radius-changed', 'center-changed'],
+            onListen: (type) => {
+                if (type === 'radius-changed') {
+                    this.prevRadius = this.innerOverlay.getRadius();
+                    this.innerOverlay.on('editrecord', this.onRadiusChanged);
+                }
+                else {
+                    this.prevCenter = this.innerOverlay.getCoordinates();
+                    this.innerOverlay.on('editrecord', this.onCenterChanged);
+                }
+            },
+            onCancel: (type) => {
+                this.innerOverlay.off('editrecord', type === 'radius-changed' ? this.onRadiusChanged : this.onCenterChanged);
+            },
+        }));
+    }
+    onRadiusChanged = () => {
+        const radius = this.innerOverlay.getRadius();
+        if (this.prevRadius !== radius) {
+            this.eventHubDelegate?.notify({ type: 'radius-changed', target: this });
+            this.prevRadius = radius;
+        }
+    };
+    onCenterChanged = () => {
+        const center = this.innerOverlay.getCoordinates();
+        if (this.prevCenter !== center && !this.prevCenter?.equals(center)) {
+            this.eventHubDelegate?.notify({ type: 'center-changed', target: this });
+            this.prevCenter = center;
+        }
+    };
     setCenter(center) {
         this.coordType = this.map.coordType;
         this.innerOverlay.setCoordinates(center.toTalks(this.coordType));
@@ -9121,6 +9213,13 @@ class TalksLabelOverlay extends TalksOverlay {
         });
         return new TalksLabelOverlay(label, coord, this);
     }
+    addTo(map) {
+        this.map = map;
+        this.innerOverlay.addTo(map.innerMap);
+    }
+    remove() {
+        this.innerOverlay.remove();
+    }
     setContent(content) {
         this.innerOverlay.setContent(content);
     }
@@ -9316,8 +9415,8 @@ const MarkerLabel = {
     },
     toGoogle: (label) => label,
     toTalks: (label, options) => {
-        if (process.env.NODE_ENV !== 'production' && label.className) {
-            console.warn('talks的MarkerLabel不支持设置className', label);
+        if (process.env.NODE_ENV !== 'production' && label.className && !label.talksStyle) {
+            console.warn('talks的MarkerLabel不支持设置className, 请为它设置talksStyle, 以实现类似的显示效果', label);
         }
         return {
             properties: {
@@ -9332,6 +9431,7 @@ const MarkerLabel = {
                 textWeight: label.fontWeight,
                 textFaceName: label.fontFamily ?? 'Roboto, Arial, sans-serif',
                 ...options,
+                ...label.talksStyle,
             },
         };
     },
@@ -9638,6 +9738,13 @@ class TalksMarker extends TalksOverlay {
         super(innerOverlay, coordType, map);
         this.state = state;
     }
+    addTo(map) {
+        this.map = map;
+        this.map.markerLayer.addGeometry(this.innerOverlay);
+    }
+    remove() {
+        this.map.markerLayer.removeGeometry(this.innerOverlay);
+    }
     getPosition() {
         return LatLng.fromTalks(this.innerOverlay.getCoordinates(), this.coordType);
     }
@@ -9906,6 +10013,12 @@ class TalksPolyline extends TalksShape {
         });
         return new TalksPolyline(inner, coordType, this);
     }
+    createDelegate() {
+        return new TalksEventTargetDelegate(this.innerOverlay, this.map, {
+            // https://maptalks.org/maptalks.js/api/1.x/Geometry.html#event:editrecord
+            'path-edited': 'editrecord',
+        });
+    }
     getPath() {
         return this.innerOverlay.getCoordinates().map(it => LatLng.fromTalks(it, this.coordType));
     }
@@ -10024,6 +10137,12 @@ class TalksPolygon extends TalksShape {
         });
         return new TalksPolygon(inner, coord, this);
     }
+    createDelegate() {
+        return new TalksEventTargetDelegate(this.innerOverlay, this.map, {
+            // https://maptalks.org/maptalks.js/api/1.x/Geometry.html#event:editrecord
+            'paths-edited': 'editrecord',
+        });
+    }
     getPaths() {
         return this.innerOverlay.getCoordinates()
             .map(path => path.map(it => LatLng.fromTalks(it, this.coordType)));
@@ -10189,6 +10308,12 @@ class TalksRectangle extends TalksShape {
             height: computeDistanceBetween(nw, bounds.sw),
         };
     }
+    createDelegate() {
+        return new TalksEventTargetDelegate(this.innerOverlay, this.map, {
+            // https://maptalks.org/maptalks.js/api/1.x/Geometry.html#event:editrecord
+            'bounds-changed': 'editrecord',
+        });
+    }
     getBounds() {
         return LatLngBounds.fromTalks(this.innerOverlay.getExtent(), this.coordType);
     }
@@ -10391,12 +10516,6 @@ class BaiduMap extends BaseMap {
     removeElementOverlay(overlay) {
         this.map.removeOverlay(overlay.asBaidu());
     }
-    addOverlay(overlay) {
-        this.map.addOverlay(overlay.innerOverlay);
-    }
-    removeOverlay(overlay) {
-        this.map.removeOverlay(overlay.innerOverlay);
-    }
     addCustomControl(control) {
         if (!control.inner) {
             const BaiduControl = class extends BMap.Control {
@@ -10617,12 +10736,6 @@ class GoogleMap extends BaseMap {
     removeElementOverlay(overlay) {
         overlay.asGoogle().setMap(null);
     }
-    addOverlay(overlay) {
-        overlay.innerOverlay.setMap(this.map);
-    }
-    removeOverlay(overlay) {
-        overlay.innerOverlay.setMap(null);
-    }
     addCustomControl(control) {
         if (!control.inner) {
             control.inner = control.onCreateElement();
@@ -10771,12 +10884,6 @@ class HereMap extends BaseMap {
     removeElementOverlay(overlay) {
         throw new Error('Method not implemented.');
     }
-    addOverlay(overlay) {
-        throw new Error('Method not implemented.');
-    }
-    removeOverlay(overlay) {
-        throw new Error('Method not implemented.');
-    }
     createMarker(options) {
         throw new Error('Method not implemented.');
     }
@@ -10858,7 +10965,8 @@ const quadKey = (z, x, y) => {
 };
 const talksBaseLayerIds = [
     'osm',
-    'osm-simple',
+    'osm-light',
+    'osm-dark',
     'google',
     'baidu',
     'baidu-detail',
@@ -10874,7 +10982,8 @@ function talksBaseLayerIdToCoordType(layerId) {
         case 'baidu':
         case 'baidu-detail':
             return CoordType.bd09;
-        case 'osm-simple':
+        case 'osm-light':
+        case 'osm-dark':
         case 'osm':
         case 'yandex':
             return CoordType.wgs84;
@@ -10991,13 +11100,20 @@ function createTalksBaseLayer(layerId, { id = layerId, visible = true, } = {}) {
                 subdomains: ['a', 'b', 'c'],
                 attribution: '&copy; <a target="_blank" href="http://www.osm.org/copyright">OSM</a>',
             });
-        case 'osm-simple':
+        case 'osm-light':
             return new maptalks.TileLayer(id, {
                 visible,
                 urlTemplate: 'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png',
                 subdomains: ['a', 'b', 'c', 'd'],
                 attribution: '&copy; <a target="_blank" href="http://www.osm.org/copyright">OSM</a> contributors, &copy; <a target="_blank" href="https://carto.com/attributions">CARTO</a>',
             });
+        case 'osm-dark':
+            return new maptalks.TileLayer(id, {
+                visible,
+                urlTemplate: 'http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png',
+                subdomains: ['a', 'b', 'c', 'd'],
+                attribution: '&copy; <a target="_blank" href="http://www.osm.org/copyright">OSM</a> contributors, &copy; <a target="_blank" href="https://carto.com/attributions">CARTO</a>',
+            });
     }
 }
 
@@ -11007,7 +11123,9 @@ class TalksMap extends BaseMap {
     map;
     /** @internal */
     currentBaseLayerId;
+    /** @internal */
     markerLayer;
+    /** @internal */
     overlayLayer;
     constructor(element, mapOptions, baseLayoutIds) {
         super(element);
@@ -11153,22 +11271,6 @@ class TalksMap extends BaseMap {
     removeElementOverlay(overlay) {
         // TODO: 2026/01/05 ipcjs 下一版再实现该功能
     }
-    addOverlay(overlay) {
-        if (overlay.innerOverlay instanceof maptalks.ui.UIComponent) {
-            overlay.innerOverlay.addTo(this.map);
-            return;
-        }
-        const layer = overlay instanceof TalksMarker ? this.markerLayer : this.overlayLayer;
-        layer.addGeometry(overlay.innerOverlay);
-    }
-    removeOverlay(overlay) {
-        if (overlay.innerOverlay instanceof maptalks.ui.UIComponent) {
-            overlay.innerOverlay.remove();
-            return;
-        }
-        const layer = overlay instanceof TalksMarker ? this.markerLayer : this.overlayLayer;
-        layer.removeGeometry(overlay.innerOverlay);
-    }
     createMarker = TalksMarker.create;
     createMarkerClusterer(options) {
         return new TalksMarkerClusterer(this, options);