feat: 新增地图状态控制方法

packages/core/src/services/config/ConfigService.ts

@@ -17,6 +17,9 @@ const defaultSceneConfig: Partial<ISceneConfig & IRenderConfig> = {
   logoVisible: true,
   antialias: true,
   preserveDrawingBuffer: false,
+  fitBoundsOptions: {
+    animate: false,
+  },
 };
 
 /**

packages/core/src/services/map/IMapService.ts

@@ -11,6 +11,15 @@ export interface IPoint {
   y: number;
 }
 
+export interface IStatusOptions {
+  showIndoorMap: boolean;
+  resizeEnable: boolean;
+  dragEnable: boolean;
+  keyboardEnable: boolean;
+  doubleClickZoom: boolean;
+  zoomEnable: boolean;
+  rotateEnable: boolean;
+}
 export type MapStyle = string | { [key: string]: any };
 export interface IMapWrapper {
   setContainer(container: Container, id: string | HTMLDivElement): void;
@@ -56,6 +65,7 @@ export interface IMapService<RawMap = {}> {
   setPitch(pitch: number): void;
   setZoom(zoom: number): void;
   setMapStyle(style: any): void;
+  setStatus(option: Partial<IStatusOptions>): void;
 
   // coordinates methods
   pixelToLngLat(pixel: Point): ILngLat;

packages/maps/src/amap/map.ts

@@ -11,6 +11,7 @@ import {
   IMapConfig,
   IMapService,
   IPoint,
+  IStatusOptions,
   IViewport,
   MapServiceEvent,
   MapStyle,
@@ -201,6 +202,10 @@ export default class AMapService
   public setMapStyle(style: string): void {
     this.map.setMapStyle(this.getMapStyle(style));
   }
+
+  public setStatus(option: Partial<IStatusOptions>) {
+    this.map.setStatus(option);
+  }
   public pixelToLngLat(pixel: [number, number]): ILngLat {
     const lngLat = this.map.pixelToLngLat(new AMap.Pixel(pixel[0], pixel[1]));
     return { lng: lngLat.getLng(), lat: lngLat.getLat() };

packages/maps/src/mapbox/map.ts

@@ -11,6 +11,7 @@ import {
   IMapConfig,
   IMapService,
   IPoint,
+  IStatusOptions,
   IViewport,
   MapServiceEvent,
   MapStyle,
@@ -168,6 +169,38 @@ export default class MapboxService
   public setMinZoom(min: number): void {
     this.map.setMinZoom(min);
   }
+  public setStatus(option: Partial<IStatusOptions>) {
+    if (option.doubleClickZoom === true) {
+      this.map.doubleClickZoom.enable();
+    }
+    if (option.doubleClickZoom === false) {
+      this.map.doubleClickZoom.disable();
+    }
+    if (option.dragEnable === false) {
+      this.map.dragPan.disable();
+    }
+    if (option.dragEnable === true) {
+      this.map.dragPan.enable();
+    }
+    if (option.rotateEnable === false) {
+      this.map.dragRotate.disable();
+    }
+    if (option.dragEnable === true) {
+      this.map.dragRotate.enable();
+    }
+    if (option.keyboardEnable === false) {
+      this.map.keyboard.disable();
+    }
+    if (option.keyboardEnable === true) {
+      this.map.keyboard.enable();
+    }
+    if (option.zoomEnable === false) {
+      this.map.scrollZoom.disable();
+    }
+    if (option.zoomEnable === true) {
+      this.map.scrollZoom.enable();
+    }
+  }
 
   public setZoomAndCenter(zoom: number, center: [number, number]): void {
     this.map.flyTo({

packages/scene/src/IMapController.ts

@@ -1,4 +1,4 @@
-import { Bounds, ILngLat, IPoint, Point } from '@antv/l7-core';
+import { Bounds, ILngLat, IPoint, IStatusOptions, Point } from '@antv/l7-core';
 
 export default interface IMapController {
   /**
@@ -51,17 +51,28 @@ export default interface IMapController {
    */
   fitBounds(bound: Bounds, fitBoundsOptions?: unknown): void;
 
+  getContainer(): HTMLElement | null;
+  getSize(): [number, number];
+  // get map status method
+  getMinZoom(): number;
+  getMaxZoom(): number;
+  // get map params
+  getType(): string;
+  getMapContainer(): HTMLElement | null;
+
+  // control with raw map
   setRotation(rotation: number): void;
-
   setZoomAndCenter(zoom: number, center: Point): void;
+  setCenter(center: [number, number]): void;
+  setPitch(pitch: number): void;
+  setZoom(zoom: number): void;
+  setMapStyle(style: any): void;
+  setStatus(option: Partial<IStatusOptions>): void;
 
-  setMapStyle(style: string): void;
-
+  // coordinates methods
   pixelToLngLat(pixel: Point): ILngLat;
-
   lngLatToPixel(lnglat: Point): IPoint;
-
   containerToLngLat(pixel: Point): ILngLat;
-
   lngLatToContainer(lnglat: Point): IPoint;
+  exportMap(type: 'jpg' | 'png'): string;
 }

packages/scene/src/index.ts

@@ -24,6 +24,7 @@ import {
   IRendererService,
   ISceneConfig,
   ISceneService,
+  IStatusOptions,
   Point,
   SceneEventList,
   TYPES,
@@ -58,20 +59,10 @@ class Scene
   private popupService: IPopupService;
   private fontService: IFontService;
   private interactionService: IInteractionService;
-  private animate: boolean;
-  private fitBoundsOptions: unknown;
   private container: Container;
 
   public constructor(config: ISceneConfig) {
-    const {
-      id,
-      map,
-      logoPosition,
-      logoVisible = true,
-      animate = true,
-      fitBoundsOptions = {},
-    } = config;
-    this.fitBoundsOptions = fitBoundsOptions;
+    const { id, map } = config;
     // 创建场景容器
     const sceneContainer = createSceneContainer();
     this.container = sceneContainer;
@@ -112,6 +103,21 @@ class Scene
 
     this.initControl();
   }
+  public getSize(): [number, number] {
+    return this.mapService.getSize();
+  }
+  public getMinZoom(): number {
+    return this.mapService.getMinZoom();
+  }
+  public getMaxZoom(): number {
+    return this.mapService.getMaxZoom();
+  }
+  public getType(): string {
+    return this.mapService.getType();
+  }
+  public getMapContainer(): HTMLElement | null {
+    return this.mapService.getMapContainer();
+  }
 
   public getMapService(): IMapService<unknown> {
     return this.mapService;
@@ -279,13 +285,14 @@ class Scene
   public setZoom(zoom: number): void {
     this.mapService.setZoom(zoom);
   }
-  public fitBounds(bound: Bounds, fitBoundsOptions?: unknown): void {
+  public fitBounds(bound: Bounds, options?: unknown): void {
+    const { fitBoundsOptions, animate } = this.sceneService.getSceneConfig();
     this.mapService.fitBounds(
       bound,
       // 选项优先级：用户传入，覆盖animate直接配置，覆盖Scene配置项传入
-      fitBoundsOptions || {
-        ...(this.fitBoundsOptions as object),
-        animate: this.animate,
+      options || {
+        ...(fitBoundsOptions as object),
+        animate,
       },
     );
   }
@@ -298,6 +305,10 @@ class Scene
     this.mapService.setMapStyle(style);
   }
 
+  public setStatus(options: IStatusOptions) {
+    this.mapService.setStatus(options);
+  }
+
   // conversion Method
   public pixelToLngLat(pixel: Point): ILngLat {
     return this.mapService.pixelToLngLat(pixel);

stories/React/components/world_ncov_fill.tsx

@@ -85,7 +85,7 @@ export default React.memo(function Map() {
           center: [110.19382669582967, 50.258134],
           pitch: 0,
           style: 'blank',
-          zoom: 1,
+          zoom: 10,
         }}
         style={{
           position: 'absolute',