From de4c4da320e102c8e741f48695e7145b1008420c Mon Sep 17 00:00:00 2001
From: RoXoM <xyy94813@sina.com>
Date: Sat, 11 Nov 2023 00:09:43 +0800
Subject: [PATCH] =?UTF-8?q?feat(AMapMap):=203D=20=E8=A7=86=E5=9B=BE?=
 =?UTF-8?q?=E4=B8=8B=E6=94=AF=E6=8C=81=E8=AE=BE=E7=BD=AE=09=E4=BF=AF?=
 =?UTF-8?q?=E4=BB=B0=E8=A7=92=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AMapMap/AMapMap.tsx                |  2 ++
 src/components/AMapMap/__tests__/AMapMap.test.tsx |  6 ++++--
 src/components/AMapMap/interface.ts               |  1 +
 .../AMapMap/stories/AMapMap.stories.tsx           | 15 +++++++++++++++
 4 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/components/AMapMap/AMapMap.tsx b/src/components/AMapMap/AMapMap.tsx
index 9716f31..812382f 100644
--- a/src/components/AMapMap/AMapMap.tsx
+++ b/src/components/AMapMap/AMapMap.tsx
@@ -34,6 +34,7 @@ const AMapMap = forwardRef<any, PropsWithChildren<AMapMapProps>>(
     features,
     mapStyle,
     viewMode,
+    pitch,
   }, ref) => {
     const { __AMAP__: AMap } = useAMapAPI();
 
@@ -123,6 +124,7 @@ const AMapMap = forwardRef<any, PropsWithChildren<AMapMapProps>>(
     }, [center, curMap]);
 
     useSetter<Parameters<AMap.Map['setFeatures']>>(curMap, 'setFeatures', features!);
+    useSetter<Parameters<AMap.Map['setPitch']>>(curMap, 'setPitch', pitch!);
 
     return (
       <div style={CONTAINER_STYLE} ref={$mapContainer}>
diff --git a/src/components/AMapMap/__tests__/AMapMap.test.tsx b/src/components/AMapMap/__tests__/AMapMap.test.tsx
index cfa6ea7..5506489 100644
--- a/src/components/AMapMap/__tests__/AMapMap.test.tsx
+++ b/src/components/AMapMap/__tests__/AMapMap.test.tsx
@@ -15,6 +15,7 @@ const mockMapInstance = {
   setCenter: jest.fn(),
   setFeatures: jest.fn(),
   setMapStyle: jest.fn(),
+  setPitch: jest.fn(),
   on: jest.fn(),
 };
 
@@ -120,13 +121,14 @@ describe('AMapMap', () => {
     expect(mockMapInstance.setMapStyle).toBeCalledWith('amap://styles/grey');
   });
 
-  test('sets view mode to 3D', () => {
+  test('sets view mode and pitch', () => {
     const { __AMAP__: AMap } = useAMapAPI();
     const $div = document.createElement('div');
     $div.setAttribute('style', 'width: 100%; height: 100%;');
 
-    const { rerender } = render(<AMapMap viewMode="3D" />);
+    const { rerender } = render(<AMapMap viewMode="3D" pitch={60} />);
     expect(AMap!.Map).toBeCalledWith($div, { viewMode: '3D' });
+    expect(mockMapInstance.setPitch).toBeCalledWith(60);
 
     rerender(<AMapMap />);
 
diff --git a/src/components/AMapMap/interface.ts b/src/components/AMapMap/interface.ts
index 3650aff..87c9bda 100644
--- a/src/components/AMapMap/interface.ts
+++ b/src/components/AMapMap/interface.ts
@@ -7,4 +7,5 @@ export type AMapMapProps = {
   features?: AMap.MapOptions['features'];
   mapStyle?: AMap.MapOptions['mapStyle'];
   viewMode?: AMap.MapOptions['viewMode'];
+  pitch?: AMap.MapOptions['pitch'];
 };
diff --git a/src/components/AMapMap/stories/AMapMap.stories.tsx b/src/components/AMapMap/stories/AMapMap.stories.tsx
index c61fa28..cbba13e 100644
--- a/src/components/AMapMap/stories/AMapMap.stories.tsx
+++ b/src/components/AMapMap/stories/AMapMap.stories.tsx
@@ -79,6 +79,19 @@ export default {
       },
       control: 'text',
     },
+    pitch: {
+      description: '俯仰角度，值范围：0-90。2D地图下无效 。',
+      table: {
+        type: { summary: 'number' },
+        defaultValue: { summary: '0' },
+      },
+      control: {
+        type: 'number',
+        min: 0,
+        max: 90,
+        step: 15,
+      },
+    },
   },
 } as Meta;
 
@@ -118,4 +131,6 @@ export const ViewModeIs3D: typeof Template = Template.bind({});
 ViewModeIs3D.storyName = '3D 模式';
 ViewModeIs3D.args = {
   viewMode: '3D',
+  pitch: 75,
+  zoom: 18,
 };