绘制离线地图

src/views/pqs/panorama/index1.vue

@@ -0,0 +1,71 @@
+<template>
+    <div class="default-main">
+        <DatePicker ref="datePickerRef" theCurrentTime style="display: none" />
+        <baidu-map class="map" :style="height" @ready="initMap" :center="{ lng: 116.403765, lat: 39.914850 }" :zoom="10"
+            :scroll-wheel-zoom='true'>
+            <bm-boundary v-for="item in boundaryList" :name="item.name" :strokeWeight="2" strokeColor="#0e8780"
+                fillColor="#0e8780" fillOpacity="0.05"></bm-boundary>
+
+            <!-- <bm-polygon :path="polygonPath" stroke-color="blue" :stroke-opacity="0.5" :stroke-weight="2" :editing="true"
+                @lineupdate="updatePolygonPath" /> -->
+
+        </baidu-map>
+    </div>
+</template>
+
+<script setup lang='ts'>
+import { mainHeight } from '@/utils/layout'
+import { getAreaLineInfo } from '@/api/event-boot/areaInfo'
+import { ref, reactive ,onMounted} from 'vue'
+import DatePicker from '@/components/form/datePicker/index.vue'
+import { useDictData } from '@/stores/dictData'
+const datePickerRef = ref()
+const height = mainHeight(20)
+// 页面中直接引入就可以
+const dictData = useDictData()
+import { BaiduMap, BmBoundary, BmPolygon } from 'vue-baidu-map-3x'
+const boundaryList = ref([
+    { name: '张家口市' },
+    { name: '唐山市' },
+    { name: '秦皇岛市' },
+    { name: '承德市' },
+    { name: '廊坊市' },
+])
+
+const initMap = async ({ BMap, map }: any) => {
+
+  
+
+
+}
+const addMarkers= async()=>{
+    let params = {
+        deptIndex: '0d52f9f6e43ec0ee83013cd32da93f66',
+        monitorFlag: 2,
+        powerFlag: 2,
+        searchBeginTime: datePickerRef.value.timeValue[0],
+        searchEndTime: datePickerRef.value.timeValue[1],
+        serverName: 'event-boot',
+        statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0],
+        // ...row
+    }
+
+    let { data } = await getAreaLineInfo(params)
+
+}
+
+
+const mouseover = () => {
+    console.log(123);
+
+}
+onMounted(() => {
+    addMarkers()
+})
+</script>
+<style lang="scss" scoped>
+.map {
+    width: 100%;
+
+}
+</style>