diff --git a/src/assets/images/map/m1.png b/src/assets/images/map/m1.png deleted file mode 100644 index 128800e..0000000 Binary files a/src/assets/images/map/m1.png and /dev/null differ diff --git a/src/assets/images/map/m2.png b/src/assets/images/map/m2.png deleted file mode 100644 index 630babe..0000000 Binary files a/src/assets/images/map/m2.png and /dev/null differ diff --git a/src/view/sy_map.vue b/src/view/sy_map.vue index 82472cb..c517468 100644 --- a/src/view/sy_map.vue +++ b/src/view/sy_map.vue @@ -6,7 +6,8 @@
- 龙游县{{ title_choose }} + 龙游县 + {{ title_choose }}
@@ -102,6 +103,7 @@ import { watch, nextTick, } from "vue"; +import http from "@/utils/request.js"; import mapTown from "@/assets/json/ly.json"; import xkz from "@/assets/json/xkz.json"; import j0 from "@/assets/images/map/j0.png"; @@ -115,8 +117,6 @@ import j7 from "@/assets/images/map/j7.png"; import j8 from "@/assets/images/map/j8.png"; import j9 from "@/assets/images/map/j9.png"; import j10 from "@/assets/images/map/j10.png"; -import m1 from "@/assets/images/map/m1.png"; -import m2 from "@/assets/images/map/m2.png"; import dwd from "@/assets/images/map/dwd.png"; import fwqbg1 from "@/assets/images/map/qlv.png"; import fwqbg2 from "@/assets/images/map/qlan.png"; @@ -131,8 +131,8 @@ import b4 from "@/assets/images/map/b4.png"; import b5 from "@/assets/images/map/b5.png"; import b6 from "@/assets/images/map/b6.png"; import xcbg from "@/assets/images/map/xcbg.png"; -import http from "@/utils/request.js"; import AED from "@/assets/images/map/AED.png"; + //删除(存放渲染的地块及图标) const jdm_arr = ref([]); const jdm_number_arr = ref([]); @@ -205,13 +205,14 @@ const tsbq_id_total = ref([ name: "糖尿病", id: "tnb", }, - { + { name: "退役军人", id: "tyjr", }, ]); //点击龙游县初始化 const csh = () => { + // console.log(222, item.name); xuanzhongCs.value = []; sfdd.value = false; title_choose.value = ""; @@ -255,6 +256,7 @@ const csh = () => { const chooseCsList = ref([]); const unChooseList = ref([]); const sqname = ref(); +const townName = ref(); //中心点坐标 const center_now = ref([]); const center_center = ref([119.178783, 29.034583]); @@ -433,16 +435,43 @@ const markera = (e) => { var marker = new BMapGL.Marker(new BMapGL.Point(e.latlng.lng, e.latlng.lat), { icon: icons, }); - // 将新标记添加到地图中并更新当前标记引用 map.addOverlay(marker); currentMarker = marker; }; const BMAP = () => { // 添加鼠标点击事件监听器 - map.addEventListener("click", markera); }; +// 添加服务圈 +var circle; +const drawACircle = (v) => { + if (!circle) { + var point = new BMapGL.Point(119.184803, 28.853725); + circle = new BMapGL.Circle(point, 900, { + strokeColor: "yellow", + strokeWeight: 2, + + strokeOpacity: 0.8, + fillOpacity: 0.1, + // fillColor: "yellow", + strokeStyle: "dashed", + zIndex: 99, + }); + map.addOverlay(circle); + } + + if (v === "hide") { + circle.hide(); + } else { + circle.show(); + map.addOverlay(circle); + map.setViewport({ + center: new BMapGL.Point(119.184803, 28.853725), + zoom: 14, + }); + } +}; const initMap = () => { map = new BMapGL.Map("map", { minZoom: 11, maxZoom: 20 }); @@ -499,8 +528,8 @@ const addPolygonCounty = () => { map.addOverlay(polygon); polygon.addEventListener("click", () => { - // console.log(11111, item.name); - + townName.value = item.name; + console.log(11111, item.name, townName.value); // if(item.name !== "溪口镇"){ //   jrcs.value=false; //   console.log( jrcs.value,'000'); @@ -666,6 +695,7 @@ const addPolygonCountyCs = () => { } }); title_choose.value = title_choose.value + `>${item.name}`; + console.log(item.name); cs_qk_arr.value.forEach((item, index) => { map.removeOverlay(cs_qk_arr.value[index]); }); @@ -1166,12 +1196,16 @@ const DGcreateCs2 = (polygon, indexx) => { }; //创建公共服务圈 const addggfwq = () => { + // if (!fwqList || !fwqList.value) { fwqList.value.map((item, index) => { createCustomOverlay(item, index); }); + // return; + // } }; // 添加公共服务圈的图标 const createCustomOverlay = (polygon, indexx) => { + drawACircle(); function createLabelDOM() { var content = document.createElement("div"); content.style.display = "flex"; @@ -1321,27 +1355,33 @@ const changebq = (id) => { } // choose.value.person = id; }; +//基本公共服务圈点击 const changeFwq = (id, list, center) => { if (choose.value.fwq == id) { // chooseArr.value = chooseArr.value.filter((item) => item !== "fwq"); choose.value.fwq = 9999; - // removeAllPolygon("fwq"); + console.log(11); + csh(); + addPolygonCounty(); + setTimeout(() => { + drawACircle("hide"); + }, 500); + // 清空地图上所有的覆盖物 fwq_list_arr.value.forEach((item, index) => { map.removeOverlay(fwq_list_arr.value[index]); }); - // xuanran(); } else { - // chooseArr.value.push("fwq"); choose.value.fwq = id; fwqList.value = list; - // removeAllPolygon("fwq"); - addggfwq(); - // xuanran(); - setTimeout(() => { - goMapCenter(center, 17); - }, 500); + // 清空地图上所有的覆盖物 + console.log(22); + map.clearOverlays(); - // addggfwq() + setTimeout(() => { + // drawACircle(); + addggfwq(); + goMapCenter(center, 16); + }, 500); } // choose.value.fwq = id; @@ -1352,6 +1392,7 @@ const changeFwq = (id, list, center) => { // createCustomOverlay(item); // }); }; + const changeys = (id) => { choose.value.yaosu = id; }; @@ -1515,7 +1556,6 @@ const tsbqTotal = ref([ ]); //基本公共服务圈 - const jbfwqTotal = ref([ { id: 0, @@ -2388,6 +2428,25 @@ const reset_font = () => { "scale(" + width / 1920 + "," + height / 1080 + ")"; } }; +// function initializeMap() { +// map = new BMapGL.Map("allmap"); +// var point = new BMapGL.Point(119.175728, 28.846981); +// map.centerAndZoom(point, 16); +// map.enableScrollWheelZoom(true); + +// // Initialize circle but don't add it to map yet +// circle = new BMapGL.Circle(point, 900, { +// strokeColor: "yellow", +// strokeWeight: 2, +// strokeOpacity: 0.8, +// fillOpacity: 0.1, +// fillColor: "yellow", +// strokeStyle: "dashed", +// zIndex: 99, +// }); +// } + +// window.onload = initializeMap; onMounted(() => { reset_font(); initMap(); @@ -2749,6 +2808,7 @@ onMounted(() => { .title { .title_name { + cursor: pointer; display: flex; font-family: YouSheBiaoTiHei; font-size: 34px;