From 065669d31914a2f65c48d351417f48e49bd79c0c Mon Sep 17 00:00:00 2001 From: lixuliang <lixuliang_hd@126.com> Date: 星期三, 13 三月 2024 11:30:46 +0800 Subject: [PATCH] Merge branch 'master' of http://103.135.160.14:9034/r/PM20221203225_MobileWeb --- src/utils/map2.js | 338 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 333 insertions(+), 5 deletions(-) diff --git a/src/utils/map2.js b/src/utils/map2.js index d9bef5e..19c0c81 100644 --- a/src/utils/map2.js +++ b/src/utils/map2.js @@ -1,3 +1,10 @@ +// import { Feature } from "ol"; +// import VectorLayer from "ol/layer/Vector"; +// import VectorSource from "ol/source/Vector"; +// import { Style, Icon, Fill, Stroke, Text, Circle as CircleStyle } from "ol/style"; +// import { Point, LineString } from "ol/geom"; +// import Overlay from 'ol/Overlay.js'; +// import { unByKey } from "ol/Observable.js"; //绉婚櫎浜嬩欢 import Vue from 'vue'; import axios from "axios"; import _GLOBAL from '@/assets/GLOBAL2'; @@ -6,6 +13,7 @@ import { Message } from 'element-ui'; let tdglLine, qiyexinxi, qysl, ydbm, ydlx, cyfx, crzt, ydmj, crnx, crnf, rjl, jzxg, jzmd; let objdata; +var clickEvent; window.tdglLine = tdglLine let PoiLayerConstructor = Vue.extend(poiLayer); @@ -126,7 +134,7 @@ ) // axios.get(window.gisBaseUrl + '/gisserver/wfsserver/qiyelianqiye?version=1.3.0&request=GetFeature&format=json&typename=浼佷笟閾句紒涓�') .then(dataSource => { - console.log(dataSource); + // console.log(dataSource); store.qiyeJsonInfo = dataSource }) .catch((err) => { @@ -450,7 +458,7 @@ axios .get( // "http://10.10.4.115:8022/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + - window.gisBaseUrl + "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + + window.gisBaseUrl + "BEApi/cs/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + window.clickPOI.lon + "&lat=" + window.clickPOI.lat + @@ -497,7 +505,7 @@ axios .get( // "http://10.10.4.115:8022//poisearch/guihuacon/getInfo?ydbm=" + - window.gisBaseUrl + "yzxncsApi/poisearch/guihuacon/getInfo?ydbm=" + + window.gisBaseUrl + "BEApi/cs/poisearch/guihuacon/getInfo?ydbm=" + response.data.NO ) .then( @@ -743,7 +751,9 @@ lon: lon, lat: lat, } - } else if (propertyNames.includes("id")) { + } + + else if (propertyNames.includes("id")) { objdata = { POITYPE: "POINT", name: properties["_name"]._value, @@ -882,7 +892,7 @@ //鍔犺浇涓夌淮鍥惧眰 export function loadLayer(treeNode) { - console.log('loadLayer',treeNode); + console.log('loadLayer', treeNode); let layer; switch (treeNode.sourceType) { case "tms": @@ -2191,3 +2201,321 @@ }) } } + + + +//openlayer 鍒涘缓鐐逛綅 +window.pointArr = []; +export function createPointMarker(position, obj) { + let startFeature = new ol.Feature({ + geometry: new ol.geom.Point(position), + }); + startFeature.setProperties({ + desc: obj, + }); + if (window.pointArr && window.pointArr.length > 0) { + window.pointArr.forEach(item => { + window.mapapi.removeLayer(item) + }) + window.pointArr = [] + } + let MarkerLayer = new ol.layer.Vector({ + id: 'LocationPoint', + name: '鏍囪鐐�', + source: new ol.source.Vector({ + features: [startFeature], + }), + style: new ol.style.Style({ + image: new ol.style.Icon({ + src: require('@/assets/img/collection/scdw.png'), + anchorOrigin: "top-left", + anchorXUnits: "fraction", + anchorYUnits: "fraction", + offsetOrigin: "bottom-right", + scale: 0.6, + opacity: 1, + }) + }), + zIndex: 1099, + }) + window.pointArr.push(MarkerLayer) + return MarkerLayer; +} + +//openlayer 鍦板浘鐐瑰嚮浜嬩欢 +export function setClick(state) { + function handleClick(e) { + console.log(e,'鍦板浘鐐瑰嚮') + store.setLayerPanelShow(false); + // 鍦熷湴绠$悊 + if (store.tdglInfo.flag) { + axios + .get( + // "http://10.10.4.115:8022/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + + window.gisBaseUrl + "BEApi/cs/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + + // window.gisBaseUrl + "cs/geowinmap_xncs/ds?&lng=" + + e.coordinate[0] + + "&lat=" + + e.coordinate[1] + + "&geom=true&requesttype=json" + ).then(response => { + let center = { lon: 0, lat: 0 }; + if (window.tdglLine) { + window.mapapi.removeLayer(window.tdglLine); + window.tdglLine = null; + } + var format = new ol.format.WKT(); // 鍒涘缓涓�涓� WKT 瑙f瀽鍣� + var feature = format.readFeature(response.data.geometry); // 瑙f瀽 WKT 骞剁敓鎴愯绱犲璞� + + // 鍒涘缓涓�涓绱犲浘灞� + window.tdglLine = new ol.layer.Vector({ + source: new ol.source.Vector({ + features: [feature] // 灏嗚绱犲璞″姞鍏ュ埌鍥惧眰婧愪腑 + }), + style: new ol.style.Style({ + stroke: new ol.style.Stroke({ + color: 'red', + width: 3 + }), + }) + }); + window.mapapi.addLayer(window.tdglLine) + + + axios.get( + // "http://10.10.4.115:8022//poisearch/guihuacon/getInfo?ydbm=" + + window.gisBaseUrl + "BEApi/cs/poisearch/guihuacon/getInfo?ydbm=" + response.data.NO + ).then((info) => { + let data = info.data.data; + if (data.yongdishuju === null) { + objdata = { + POITYPE: "NOTDGL", + zwxx: "鏆傛棤淇℃伅", + lon: e.coordinate[0], + lat: e.coordinate[1], + } + } else { + qiyexinxi = info.data.data.qiyexinxi; + qysl = data.qiyexinxi.length; + if (qysl > 0) { + ydbm = data.qiyexinxi[0]["鍦板潡缂栧彿"]; + } else { + ydbm = data.churangxinxi["ydbh"]; + } + try { + ydlx = data.yongdishuju["ydlxmc"]; + } catch (e) { } + try { + cyfx = data.yongdishuju["cyfx"]; + } catch (e) { } + try { + // this.crzt = response.data["ZT"]; + switch (response.data["ZT"]) { + case 3: + crzt = "宸插嚭璁�"; + break; + case 4: + crzt = "鏈嚭璁�"; + break; + } + } catch (e) { } + try { + ydmj = parseFloat( + "" + data.yongdishuju["ydmj"] + ).toFixed(0); + } catch (e) { } + try { + crnx = data.churangxinxi["crnx"]; + } catch (e) { } + try { + crnf = data.churangxinxi["crnf"]; + } catch (e) { } + try { + rjl = data.yongdishuju["rjl"]; + } catch (e) { } + try { + jzxg = data.yongdishuju["jzxg"]; + } catch (e) { } + try { + jzmd = data.yongdishuju["jzmd"]; + } catch (e) { } + objdata = { + POITYPE: "TDGL", + ydbm, + ydlx, + cyfx, + crzt, + ydmj, + ydbm, + crnx, + crnf, + rjl, + jzxg, + jzmd, + lon: e.coordinate[0], + lat: e.coordinate[1], + } + } + + store.setTdglShow(false); + store.setTdlgInfo({}); + store.setTdglShow(true); + store.setTdlgInfo(objdata); + } + ); + + }) + return; + } + + window.mapapi.forEachFeatureAtPixel(e.pixel, function (feature) { + console.log(feature.getProperties(), 'aaa'); + + //鎼滅储鐨勭偣浣� + if (window.pointArr.length > 0) { + let obj = feature.getProperties().desc + objdata = { + POITYPE: "POINT", + name: obj.name, + address: obj.address, + } + } else { + let properties = feature.getProperties().features[0].values_; + for (const propertyNames in properties) { + if (propertyNames.indexOf("鐩戞帶鍚�") !== -1) { + const infoM = Message({ + message: '璇ョ偣浣嶈棰戠洃鎺ф煡璇腑锛岃绋嶅悗', + type: 'info', + offset: 75, + center: true, + duration: 0, + }); + axios + .get( + // 璇锋眰鍦ㄧ嚎鐘舵�� + window.gisBaseUrl + "BEApi/getCameraDetails?cameraIndexCode=" + + properties["JK鍐呯爜"] + ).then(res => { + if (res.data.data.status == 1) { + infoM.close(); + Message({ + message: '瑙嗛鐩戞帶鍦ㄧ嚎涓�', + type: 'success', + offset: 75, + center: true, + duration: 2000, + }); + layerOpen(properties["JK鍚嶇О"], { + width: "100%", + height: "40%", + // offset: [offsetTop + "px", "380px"], + url: "../../static/video/video.html?code=" + properties["JK鍐呯爜"], + fn: { + success: (layero, index) => { + SmartEarthPopupData.layerContainer = layero; + }, + end: () => { + + }, + cancel: () => { + + }, + }, + }); + } else { + infoM.close(); + Message({ + message: '璇ョ偣浣嶈棰戠洃鎺х绾夸腑', + type: 'errer', + offset: 75, + center: true, + duration: 2000, + }); + return + } + }) + return + } else if (propertyNames.indexOf("閮ㄤ欢鍚嶇О") !== -1) { + objdata = { + // 鐐逛綅绫诲瀷锛堜腑鑻辨枃閰嶇疆琛╬oiKeys.js) + POITYPE: "CSBJ", + // 灞曠ず瀛楁 + name: properties["閮ㄤ欢鍚嶇О"], + address: properties["瀹夎鍦板潃"], + code: properties["閮ㄤ欢缂栫爜"], + type: properties["閮ㄤ欢绫诲瀷"], + // 寮规缁忕含搴� + lon: properties["Longtitude"], + lat: properties["Latitude"], + } + } else if (propertyNames.indexOf("浜曠紪鍙�") !== -1) { + objdata = { + POITYPE: "YINJ", + name: properties["浜曞悕绉�"], + depth: properties["浜曟繁"], + type: properties["浜曠被鍨�"], + location: properties["浣嶇疆"], + code: properties["浜曠紪鍙�"], + lon: properties["Longtitude"], + lat: properties["Latitude"], + } + } else if (propertyNames.indexOf("QYMC") !== -1) { + objdata = { + POITYPE: "QY", + QYMC: properties["QYMC"], + XYDM: properties["XYDM"], + BZDZ: properties["BZDZ"], + DZ: properties["DZ"], + lon: properties["Longtitude"], + lat: properties["Latitude"], + } + } + } + } + + + + + + store.setTdglShow(false); + store.setTdlgInfo({}); + store.setdwShow(true); + store.setdwInfo(objdata); + }); + } + if (state) { + clickEvent = window.mapapi.on('click', handleClick); + } else { + ol.Observable.unByKey(clickEvent) + clickEvent = null + } +} + + +export function flyToPoint(posisitons) { + window.mapapi.getView().animate({ + center: posisitons, + zoom: 15, + duration: 1500 + }) +} + +//鐩戝惉鍦板浘鍙屽嚮浜嬩欢 + +export function touchClick() { + let dom = document.getElementById('openlayerContainer'); + dom.addEventListener('touchstart', onTouchStart); + function onTouchStart(e) { + let len = e.touches.length; + if (len === 2) { + window.mapapi.getView().animate({ + center: window.mapapi.getView().getCenter(), + zoom: window.mapapi.getView().getZoom() - 1, + duration: 1000, + }); + } + } +} + + + -- Gitblit v1.9.3