feature/业务线管理

src/lib/AmapViewer/index.ts

@@ -13,14 +13,17 @@ const pluginsList = [
   "AMap.PolyEditor",
   "AMap.PolylineEditor"
 ];
-export default class Amap {
+export default class AmapViewer {
   public id: string;
+  public center: number[];
   public amapDom!: HTMLElement;
   public map!: any;
+  public AMap!: any;
   public normalMarker!: any;
 
-  constructor(id: string) {
+  constructor(id: string, center: number[]) {
     this.id = id;
+    this.center = center;
     this.initAmap();
   }
 
@@ -38,6 +41,7 @@ export default class Amap {
       jsapi.src = url;
       document.head.appendChild(jsapi);
       jsapi.onload = () => {
+        console.log(1111, AMap)
         this.initMap();
       };
       jsapi.onerror = function () {
@@ -51,7 +55,7 @@ export default class Amap {
     this.amapDom = document.getElementById(this.id) as HTMLElement;
     this.map = new AMap.Map(this.amapDom, {
       zoom: 18,
-      center: [118.794694, 32.434165],
+      center: this.center,
       resizeEnable: true,
       viewMode: "3D",
       defaultCursor: "default",

src/pages/demo/threeAmap/index.tsx

@@ -1,21 +1,25 @@
 import React, { useEffect, useRef } from "react";
-import Amap from "@/lib/amap";
+import AmapViewer from "@/lib/AmapViewer";
+import ShadowMaterialAmap from "./modules/shadow";
 import styles from "./index.less";
 
 interface OwnProps {}
 
 type Props = OwnProps;
 
-const PAGE_ID = "DEMO_THREEAMAP";
+const PAGE_ID = "DEMO_THREEAMAP",
+  CENTER = [118.794694, 32.434165];
 const ThreeAmap: React.FC<Props> = (props) => {
-  const amapRef = useRef<Amap>();
+  const amapRef = useRef<AmapViewer>();
   useEffect(() => {
     init();
     return () => amapRef.current?.destoryMap();
   }, []);
   const init = () => {
-    amapRef.current = new Amap(PAGE_ID);
+    amapRef.current = new AmapViewer(PAGE_ID, CENTER);
     const amap = amapRef.current;
+    const shadowMaterialAmap = new ShadowMaterialAmap(amap);
+    shadowMaterialAmap.CreateGLlayer();
   };
   return (
     <div className={styles.amap_container}>

src/pages/demo/threeAmap/modules/shadow/index.ts

@@ -0,0 +1,24 @@
+import type AmapViewer from "src/lib/AmapViewer";
+
+export default class ShadowMaterialAmap {
+  protected Amap!: any;
+
+  constructor(map: AmapViewer) {
+    this.Amap = map;
+  }
+
+  // 创建 GL 图层
+  public CreateGLlayer() {
+    console.log("gllayer", this.Amap);
+    return;
+    const gllayer = new AMap.GLCustomLayer({
+      zIndex: 10, // 初始化的操作
+      init: (gl: any) => {
+        console.log("gl", gl);
+      },
+      render: () => {
+        console.log(123);
+      }
+    });
+  }
+}