添加Map组件

src/render/components/Map.vue

@@ -0,0 +1,63 @@
+<template>
+  <div id="map-container" class="w-h-full"></div>
+</template>
+
+<script lang="ts" setup>
+import { onMounted } from 'vue'
+
+let map 			  = null
+const initMap 	= () => {
+  if (typeof(BMapGL) == 'undefined') {
+    alert('地图api加载失败')
+    return
+  }
+
+  map = new BMapGL.Map('map-container', {
+    style: {
+      styleJson: styleJson2
+    }
+  });
+  map.centerAndZoom(new BMapGL.Point(79.068798, 39.868490), 11);
+  map.enableScrollWheelZoom(true);
+  map.setTilt(50);
+}
+
+const loadPrism = () => {
+  if (!map) return
+
+  const bd = new BMapGL.Boundary();
+  bd.get('图木舒克', function (rs) {
+      const count = rs.boundaries.length;
+      
+      for (let i = 0; i < count; i++) {
+        const path   = [];
+        const str    = rs.boundaries[i].replace(' ', '');
+        const points = str.split(';');
+
+        for (let j = 0; j < points.length; j++) {
+          const lng = points[j].split(',')[0];
+          const lat = points[j].split(',')[1];
+          path.push(new BMapGL.Point(lng, lat));
+        }
+
+        const prism = new BMapGL.Prism(path, 1000, {
+          topFillColor: '#5679ea',
+          topFillOpacity: 0.6,
+          sideFillColor: '#5679ea',
+          sideFillOpacity: 0.9
+        });
+
+        map.addOverlay(prism);
+      }
+  });
+}
+
+onMounted(() => {
+  initMap()
+  loadPrism()
+})
+
+const update = () => console.log
+
+defineExpose({ update })
+</script>