From e8ec0a53b3fddeaf0f70ef38abad9a2ad1207c93 Mon Sep 17 00:00:00 2001 From: ZhAkps <46207005+ZhAkps@users.noreply.github.com> Date: 星期二, 06 二月 2024 15:39:02 +0800 Subject: [PATCH] Merge branch 'master' of http://106.120.22.35:48888/r/PM20221203225_MobileWeb --- src/utils/map2.js | 127 ++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 126 insertions(+), 1 deletions(-) diff --git a/src/utils/map2.js b/src/utils/map2.js index d9bef5e..977fba4 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); @@ -882,7 +890,7 @@ //鍔犺浇涓夌淮鍥惧眰 export function loadLayer(treeNode) { - console.log('loadLayer',treeNode); + console.log('loadLayer', treeNode); let layer; switch (treeNode.sourceType) { case "tms": @@ -2191,3 +2199,120 @@ }) } } + + + +//openlayer 鍒涘缓鐐逛綅 +export function createPointMarker(position, obj) { + let startFeature = new Feature({ + geometry: new Point(position), + }); + startFeature.setProperties({ + desc: obj, + }); + let MarkerLayer = new VectorLayer({ + id: 'LocationPoint', + name: '鏍囪鐐�', + source: new VectorSource({ + features: [startFeature], + }), + style: new Style({ + image: new 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, + }) + return MarkerLayer; +} + +//openlayer 鍦板浘鐐瑰嚮浜嬩欢 +export function setClick(state) { + let ponitPanel = document.getElementById('ponitPanel'); + let overlay = new Overlay({ + element: ponitPanel, + autoPan: { + animation: { + duration: 250, + }, + }, + }); + window.map.addOverlay(overlay); + + // let _clickCallback = callback; + function handleClick(e) { + window.map.forEachFeatureAtPixel(e.pixel, function (feature) { + // console.log(feature, '111111') + if (feature && feature.values_.desc) { + let obj = feature.values_.desc + objdata = { + POITYPE: "POINT", + name: obj.name, + address: obj.address, + lon: obj.lng, + lat: obj.lat + } + + + ponitPanel.innerHTML = ` + <div class="ponitPanel-name"> + <span>鍚嶇О锛�</span> + <span>${objdata.name}</span> + </div> + <div class="ponitPanel-value"> + <span>鍦板潃锛�</span> + <span>${objdata.address}</span> + </div>` + overlay.setPosition(e.coordinate); + + // store.setPoplayerShowAction(true); + // store.setPoplayerListAction(objdata); + // if (window.instance) { + // window.instance.$destroy(); + // } + // window.instance = new PoiLayerConstructor({ + // data: { + // list: objdata + // } + // }); + // window.instance.$mount(); + } + }); + } + if (state) { + clickEvent = window.map.on('click', handleClick); + } else { + unByKey(clickEvent) + clickEvent = null + } +} + + +export function flyToPoint(posisitons) { + let zoom = window.map.getView().getZoom(); + if (zoom >= 16) { + zoom = 12 + } + let duration = 2000; + window.map.getView().animate({ + center: posisitons, + }) + window.map.getView().animate( + //鍔ㄧ敾寮�濮嬫椂 + { + zoom: zoom > 16 ? zoom - 0.01 : zoom + 0.01, + duration: duration / 2, + }, + //鍔ㄧ敾缁撴潫鏃� + { + zoom: zoom >= 16 ? 16 : zoom + 4, + duration: duration / 2, + } + ); +} \ No newline at end of file -- Gitblit v1.9.3