From 15f5680b532238290d0adf095a93e5af1c5f1203 Mon Sep 17 00:00:00 2001 From: zuoxiao <470321431@qq.com> Date: 星期五, 07 二月 2025 17:14:57 +0800 Subject: [PATCH] 1.添加显示隐藏取水口、分水房功能 2.完善图例自定义控件功能和显示 3.处理工单添加选择时间功能 --- app/src/main/assets/js/map.js | 643 ++++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 510 insertions(+), 133 deletions(-) diff --git a/app/src/main/assets/js/map.js b/app/src/main/assets/js/map.js index 58b8398..bfd0f8d 100644 --- a/app/src/main/assets/js/map.js +++ b/app/src/main/assets/js/map.js @@ -1,14 +1,62 @@ (function () { - // 鍥剧墖璺緞 - const locationIMGPath = 'img/location.png'; - const markerBalckPath = 'img/marker_black.svg'; - const markerRedPath = 'img/marker_red.svg'; - const markerBluePath = 'img/marker_blue.svg'; + // 寤鸿灏嗚繖浜涘父閲忕Щ鍒颁竴涓厤缃璞′腑缁熶竴绠$悊 + const CONFIG = { + IMAGES: { + LOCATION: 'img/location.png', + MARKER_BLACK: 'img/marker_black.svg', + MARKER_RED: 'img/marker_red.svg', + MARKER_BLUE: 'img/marker_blue.svg', + CENTER_PIN: 'img/push_pin.svg', + DIVIDE_BLUE: 'img/divide_home_blue.svg', + DIVIDE_RED: 'img/divide_home_red.svg' + }, + MAP: { + DEFAULT_ZOOM: 12, + TIANDITU_KEY: 'd8beed89b43160a9a185e5aff431f85d' + } + }; let map; let lastMarker = null; let lastClickedMarker = null; + let lastClickedDivide = null; let isShowWaterIntakeDetail = false; + let isShowDivideDetail = false; let zoom = 12; + + // 瀛樺偍鎵�鏈夌缃戠嚎璺殑鏁扮粍 + let pipeLineList = []; + let currentPipePath = []; + + // 瀛樺偍鎵�鏈夊彇姘村彛鏍囪鐨勬暟缁� + let waterIntakeMarkers = []; + + // 瀛樺偍鎵�鏈夊垎姘存埧鏍囪鐨勬暟缁� + let divideMarkers = []; + + // 灏嗘柟娉曟寕杞藉埌 window 涓� + function mountMethodToWindow() { + window.locationOverLay = locationOverLay; + window.showToast = showToast; + window.addMarker = addMarker; + window.setCenterAndZoom = setCenterAndZoom; + window.updateLocation = updateLocation; + window.aginShowLocation = aginShowLocation; + window.cleanLocationLay = cleanLocationLay; + window.updateInspectionLocation = updateInspectionLocation; + window.cleanLoclLay = cleanLoclLay; + window.showPin = showPin; + window.cancelPin = cancelPin; + window.refreshMarker = refreshMarker; + window.addDivide = addDivide; + window.showAllPipeLines = showAllPipeLines; + window.hideAllPipeLines = hideAllPipeLines; + window.clearAllPipeLines = clearAllPipeLines; + window.addPipeNetwork = addPipeNetwork; + window.hideAllWaterIntakes = hideAllWaterIntakes; + window.showAllWaterIntakes = showAllWaterIntakes; + window.hideAllDivides = hideAllDivides; + window.showAllDivides = showAllDivides; + } document.addEventListener('DOMContentLoaded', function () { @@ -18,18 +66,21 @@ mountMethodToWindow(); }); - window.onload = function () { - //鍔犺浇鍧愭爣鐐� - window.Android.loadMarker(); - }; + // 鍒濆鍖栧湴鍥� function initMap() { + // 褰卞儚搴曞浘 var imageURL = "http://t0.tianditu.gov.cn/img_w/wmts?" + "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" + "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=d8beed89b43160a9a185e5aff431f85d"; //鍒涘缓鑷畾涔夊浘灞傚璞� - var lay = new T.TileLayer(imageURL, { minZoom: 1, maxZoom: 18 }); - var config = { layers: [lay] }; + //褰卞儚娉ㄨ锛堝湴鍥句笂鐨勫湴鍧�锛� + var imgURL2 = "http://t0.tianditu.gov.cn/cia_w/wmts?" + "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" + + "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}" + + "&tk=d8beed89b43160a9a185e5aff431f85d"; + var lay = new T.TileLayer(imageURL, { minZoom: 6, maxZoom: 18 }); + var lay2 = new T.TileLayer(imgURL2, { minZoom: 6, maxZoom: 18 }); + var config = { layers: [lay, lay2] }; map = new T.Map("mapDiv", config); var scale = new T.Control.Scale(); //娣诲姞姣斾緥灏烘帶浠� @@ -41,7 +92,7 @@ // 鍦板浘鐐瑰嚮鍚庤幏鍙栫粡绾害 function getLngLat(lnglat) { console.log(lnglat.lng.toFixed(6) + "," + lnglat.lat.toFixed(6)); - addClickOverLay(lnglat); + // addClickOverLay(lnglat); } // 鐐瑰嚮鍚庢坊鍔犲潗鏍囩偣 @@ -80,47 +131,6 @@ } } - // 妯℃嫙娣诲姞鍙栨按鍙f爣娉� - function buttonOverLay() { - map.clearOverLays(); // 娓呯悊鍦板浘涓婄殑鎵�鏈夎鐩栫墿 - - let data_info = [ - [116.417854, 39.921988, "235鍙栨按鍙�"], - [116.406605, 39.921585, "237鍙栨按鍙�"], - [116.412222, 39.912345, "236鍙栨按鍙�"] - ]; - - for (let i = 0; i < data_info.length; i++) { - let icon = new T.Icon({ - iconUrl: markerBluePath, - iconSize: new T.Point(27, 27), - iconAnchor: new T.Point(10, 25) - }); - - let marker = new T.Marker( - new T.LngLat(data_info[i][0], data_info[i][1]), // 鍒涘缓鏍囨敞 - { icon: icon } - ); - - marker.addEventListener("click", function (data) { - addMarkerListener(data); - }); - - map.addOverLay(marker); // 灏嗘爣娉ㄦ坊鍔犲埌鍦板浘涓� - - let label = new T.Label({ - text: data_info[i][2], - position: marker.getLngLat(), - offset: new T.Point(-50, 10), // 璁剧疆鏍囨敞鏂囧瓧鐨勪綅缃� - opacity: 1, // 璁剧疆鏂囨湰鐨勬樉绀轰笉閫忔槑搴︼紙鑼冨洿0-1锛� - }); - label.setBorderLine(0); // 璁剧疆鏂囨湰鐨勮竟妗嗙嚎瀹� - label.setBackgroundColor("transparent"); // 璁剧疆鏂囨湰鐨勮儗鏅壊锛堥�忔槑鑹诧級 - label.setFontColor("#0000FF"); - label.setFontSize(10); - map.addOverLay(label); - } - } // 鏄剧ず鏍囨敞鐐瑰嚮鍚庣殑绐楀彛 function openInfo(content, e) { @@ -134,33 +144,29 @@ // 鎵嬫満鑾峰彇鍒板畾浣嶅悗鏄剧ず瀹氫綅 function locationOverLay(lng, lag) { console.log("function銆嬨�嬨�嬨�嬨�媗ocationOverLay"); - map.centerAndZoom(new T.LngLat(lng, lag), 18); - + map.centerAndZoom(new T.LngLat(lng, lag), map.getZoom()); let icon = new T.Icon({ - iconUrl: locationIMGPath, - iconSize: new T.Point(27, 27), - iconAnchor: new T.Point(10, 25) + iconUrl: CONFIG.IMAGES.LOCATION, + iconSize: new T.Point(20, 20), + iconAnchor: new T.Point(10, 10) }); - - let marker = new T.Marker(new T.LngLat(lng, lag), { icon: icon }); + let marker = new T.Marker( + new T.LngLat(lng, lag), + { icon: icon } + ); map.addOverLay(marker); } //璁剧疆鍦板浘涓績鐐� - function setCenterAndZoom(lng, lat) { + function setCenterAndZoom(lng, lat, thiszoom) { + zoom = thiszoom; console.log("function銆嬨�嬨�嬨�嬨�媠etCenterAndZoom>>>>lng:" + lng + ",lat:" + lat); map.centerAndZoom(new T.LngLat(lng, lat), zoom); } - // 灏嗘柟娉曟寕杞藉埌 window 涓� - function mountMethodToWindow() { - window.locationOverLay = locationOverLay; - window.showToast = showToast; - window.addMarker = addMarker; - window.setCenterAndZoom = setCenterAndZoom; - } + // 璋冪敤鍘熺敓瀹夊崜鏂规硶鏄剧ず鍙栨按鍙h鎯� function showWaterIntakeDetail(data) { @@ -170,98 +176,469 @@ // 璋冪敤鍘熺敓瀹夊崜鏂规硶闅愯棌鍙栨按鍙h鎯� function closeWaterIntakeDetail(data) { - if (lastClickedMarker !== null) { - // 濡傛灉鏈夌偣鍑诲彇姘村彛鍒欏皢鍙栨按鍙f仮澶嶆垚榛戣壊 - // 涓婃鐐瑰嚮鐨勬爣娉ㄦ敼涓洪粦鑹� - var defaulticon = new T.Icon({ - iconUrl: markerBluePath, - iconSize: new T.Point(27, 27), - iconAnchor: new T.Point(10, 25) - }); - lastClickedMarker.setIcon(defaulticon); - } - if (isShowWaterIntakeDetail) { - // 鍋囧鏄剧ず浜嗗彇姘村彛璇︽儏鍒欓殣钘忓彇姘村彛璇︽儏 - isShowWaterIntakeDetail = false; - window.Android.closeWaterIntakeView(); - } else { - // 鍋囧娌℃湁鏄剧ず鍙栨按鍙e垯娣诲姞鐐瑰嚮鐨勫潗鏍� - getLngLat(data.lnglat); + if (!isShowCenterPin) { + if (lastClickedMarker !== null) { + lastClickedMarker.setIcon(createIcon(CONFIG.IMAGES.MARKER_BLUE)); + } + if(lastClickedDivide!==null) + { + lastClickedDivide.setIcon(createIcon(CONFIG.IMAGES.DIVIDE_BLUE)); + } + if (isShowWaterIntakeDetail || isShowDivideDetail) { + // 鍋囧鏄剧ず浜嗗彇姘村彛璇︽儏鍒欓殣钘忓彇姘村彛璇︽儏 + isShowWaterIntakeDetail = false; + window.Android.closeWaterIntakeView(); + } else { + // 鍋囧娌℃湁鏄剧ず鍙栨按鍙e垯娣诲姞鐐瑰嚮鐨勫潗鏍� + getLngLat(data.lnglat); + } } } // 鐐瑰嚮鏍囨敞鐨勪簨浠� - function addMarkerListener(data) { - chageMarkerIcon(data); - showWaterIntakeDetail("妯℃嫙鏁版嵁"); + function addMarkerListener(id, data) { + if (!isShowCenterPin) { + chageMarkerIcon(data); + showWaterIntakeDetail(id); + } else { + showToast("褰撳墠姝e湪淇敼閫変腑鍙栨按鍙g殑缁忕含搴︼紝瀹屾垚鎴栭��鍑哄悗鎵嶅彲閫夋嫨鍏朵粬锛�"); + } + } // 淇敼鐐瑰嚮鏍囨敞鐨勫浘鏍� function chageMarkerIcon(data) { // 鐐瑰嚮鐨勬爣娉ㄦ敼涓虹孩鑹� var currentMarker = data.target; - // 鐐瑰嚮鍚庡浘鏍� - var clickedIcon = new T.Icon({ - iconUrl: markerRedPath, - iconSize: new T.Point(27, 27), - iconAnchor: new T.Point(10, 25) - }); - // 璁剧疆褰撳墠鐐瑰嚮鐨� marker 涓虹偣鍑诲悗鍥炬爣 - currentMarker.setIcon(clickedIcon); - // 鍒ゆ柇鐐瑰嚮鐨勪笉鏄悓涓�涓潗鏍� + currentMarker.setIcon(createIcon(CONFIG.IMAGES.MARKER_RED)); + if (lastClickedMarker !== null) { if (!isEqualsLngLat(data.target.getLngLat(), lastClickedMarker.getLngLat())) { - var defaulticon = new T.Icon({ - iconUrl: markerBluePath, - iconSize: new T.Point(27, 27), - iconAnchor: new T.Point(10, 25) - }); - lastClickedMarker.setIcon(defaulticon); + lastClickedMarker.setIcon(createIcon(CONFIG.IMAGES.MARKER_BLUE)); } } + if (lastClickedDivide !== null) { + lastClickedDivide.setIcon(createIcon(CONFIG.IMAGES.MARKER_BLUE)); + } lastClickedMarker = data.target; + map.panTo(currentMarker.getLngLat()); } //璋冨畨鍗撳師鐢� - function showToast() { + function showToast(data) { // 璋冪敤 JavaScript 鎺ュ彛瀵硅薄鐨勬柟娉� - window.Android.showToast('Hello, Android!'); + window.Android.showToast(data); } // 鍒ゆ柇涓や釜鍧愭爣鏄惁涓�鑷� function isEqualsLngLat(data1, data2) { return data1.lat === data2.lat && data1.lng === data2.lng; } + function addMarker(id, lng, lat, name) { + addMarker(id, lng, lat, name, false) + } //娣诲姞浠庡師鐢熶紶杩囨潵鐨勫潗鏍囧苟鏄剧ず鍦ㄥ湴鍥句笂 - function addMarker(jsonData) { - console.log("function銆嬨�嬨�嬨�嬨�媋ddMarker"); - var array = JSON.parse(jsonData); - var icon = new T.Icon({ - iconUrl: markerBluePath, - iconSize: new T.Point(27, 27), - iconAnchor: new T.Point(10, 25) + function addMarker(id, lng, lat, name, isRed) { + console.log("function銆嬨�嬨�嬨�嬨�媋ddMarker>>>id:" + id); + + const iconUrl = isRed ? CONFIG.IMAGES.MARKER_RED : CONFIG.IMAGES.MARKER_BLUE; + let marker = new T.Marker( + new T.LngLat(lng, lat), + { icon: createIcon(iconUrl) } + ); + //娣诲姞鐐瑰嚮浜嬩欢 + marker.addEventListener("click", (data) => { + addMarkerListener(id, data) }); - array.forEach(element => { - let marker = new T.Marker( - new T.LngLat(element[0], element[1]) // 鍒涘缓鏍囨敞 - , { icon: icon }); - //娣诲姞鐐瑰嚮浜嬩欢 - marker.addEventListener("click", (data) => { - addMarkerListener(data) - }); - map.addOverLay(marker); // 灏嗘爣娉ㄦ坊鍔犲埌鍦板浘涓� - let label = new T.Label({ - text: element[2], - position: marker.getLngLat(), - offset: new T.Point(-35, 8), // 璁剧疆鏍囨敞鏂囧瓧鐨勪綅缃� - opacity: 1, // 璁剧疆鏂囨湰鐨勬樉绀轰笉閫忔槑搴︼紙鑼冨洿0-1锛� - }); - label.setBorderLine(0); // 璁剧疆鏂囨湰鐨勮竟妗嗙嚎瀹� - label.setBackgroundColor("transparent"); // 璁剧疆鏂囨湰鐨勮儗鏅壊锛堥�忔槑鑹诧級 - label.setFontColor("#0000FF"); - label.setFontSize(10); - map.addOverLay(label); + + let label = new T.Label({ + text: `<div style='position:absolute;left:-50%;transform: translateX(-50%);'>${name}<div>`, + position: marker.getLngLat(), + offset: new T.Point(0, 8), + opacity: 1, }); - return "addMarker鍔犺浇鎴愬姛" + label.setBorderLine(0); + label.setBackgroundColor("transparent"); + label.setFontColor("#FFFFFF"); + label.setFontSize(10); + marker.label = label; + if (isRed) { + lastClickedMarker = marker; + } + + // 灏嗘爣璁板拰鏍囩瀛樺偍鍒版暟缁勪腑 + waterIntakeMarkers.push({ + marker: marker, + label: label + }); + + map.addOverLay(label); + map.addOverLay(marker); + return "addMarker鍔犺浇鎴愬姛 id:" + id + } + //鏇存柊浣嶅潗鏍� + function updateLocation(log, lat) { + if (locationMarker) { + map.removeOverLay(locationMarker); + } + var newPoint = new T.LngLat(log, lat); + let icon = new T.Icon({ + iconUrl: CONFIG.IMAGES.LOCATION, + iconSize: new T.Point(20, 20), + iconAnchor: new T.Point(10, 10) + }); + + locationMarker = new T.Marker( + newPoint, + { icon: icon } + ); + map.addOverLay(locationMarker); + map.panTo(newPoint); + } + //淇濆瓨瀹氫綅鍧愭爣鐢熸垚杞ㄨ抗 + var path = []; + var lineLayer = new T.Polyline([], { color: '#E9900A', weight: 3, opacity: 0.8 }); + let locationMarker; + function updateInspectionLocation(log, lat) { + var lastLat = lat; + var newPoint = new T.LngLat(log, lastLat); + path.push(newPoint); + lineLayer.setLngLats(path); + map.addOverLay(lineLayer); } + var pipePath = []; + var pipeLineLayer = new T.Polyline([], { color: '#E9900A', weight: 3, opacity: 0.8 }); + + // 绠$綉绾胯矾绠$悊 + const PipelineManager = { + lines: [], // 瀛樺偍鎵�鏈夊畬鎴愮殑绾胯矾 + currentLine: { + points: [], // 褰撳墠绾胯矾鐨勭偣 + overlay: null // 褰撳墠绾胯矾鐨勫浘灞傚璞� + }, + + // 绾胯矾鏍峰紡閰嶇疆 + style: { + color: '#1890FF', + weight: 3, + opacity: 0.8 + }, + + /** + * 娣诲姞鐐瑰埌绠$綉绾胯矾 + * @param {number} lng 缁忓害 + * @param {number} lat 绾害 + * @param {boolean} isNewLine 鏄惁寮�濮嬫柊鐨勭嚎璺� + */ + addPoint(lng, lat, isNewLine) { + if (isNewLine) { + this.finishCurrentLine(); + } + + const point = new T.LngLat(lng, lat); + this.currentLine.points.push(point); + + if (this.currentLine.points.length > 1) { + this.updateCurrentLineDisplay(); + } + }, + + /** + * 鏇存柊褰撳墠绾胯矾鐨勬樉绀� + */ + updateCurrentLineDisplay() { + if (!this.currentLine.overlay) { + // 鍒涘缓鏂扮殑绾胯矾鍥惧眰 + this.currentLine.overlay = new T.Polyline(this.currentLine.points, this.style); + map.addOverLay(this.currentLine.overlay); + } else { + // 鏇存柊鐜版湁绾胯矾鐨勭偣 + this.currentLine.overlay.setLngLats(this.currentLine.points); + } + }, + + /** + * 瀹屾垚褰撳墠绾胯矾 + */ + finishCurrentLine() { + if (this.currentLine.points.length > 1) { + if (this.currentLine.overlay) { + // 灏嗗綋鍓嶇嚎璺坊鍔犲埌瀹屾垚鍒楄〃 + this.lines.push(this.currentLine.overlay); + } + } else if (this.currentLine.overlay) { + // 濡傛灉鐐规暟涓嶈冻锛屾竻闄ゅ浘灞� + map.removeOverLay(this.currentLine.overlay); + } + + // 閲嶇疆褰撳墠绾胯矾 + this.currentLine = { + points: [], + overlay: null + }; + }, + + /** + * 鏄剧ず鎵�鏈夌嚎璺� + */ + showAll() { + this.lines.forEach(line => map.addOverLay(line)); + if (this.currentLine.overlay) { + map.addOverLay(this.currentLine.overlay); + } + }, + + /** + * 闅愯棌鎵�鏈夌嚎璺� + */ + hideAll() { + this.lines.forEach(line => map.removeOverLay(line)); + if (this.currentLine.overlay) { + map.removeOverLay(this.currentLine.overlay); + } + }, + + /** + * 娓呴櫎鎵�鏈夌嚎璺� + */ + clearAll() { + this.hideAll(); + this.lines = []; + this.currentLine = { + points: [], + overlay: null + }; + } + }; + + /** + * 娣诲姞绠$綉绾胯矾鐐� + */ + function addPipeNetwork(lng, lat, isNewLine) { + PipelineManager.addPoint(lng, lat, isNewLine); + } + + /** + * 鏄剧ず鎵�鏈夌缃戠嚎璺� + */ + function showAllPipeLines() { + PipelineManager.showAll(); + } + + /** + * 闅愯棌鎵�鏈夌缃戠嚎璺� + */ + function hideAllPipeLines() { + PipelineManager.hideAll(); + } + + /** + * 娓呴櫎鎵�鏈夌缃戠嚎璺� + */ + function clearAllPipeLines() { + PipelineManager.clearAll(); + } + + var aginPath = []; + var oldLineLayer = new T.Polyline([], { color: '#E9900A', weight: 3, opacity: 0.8 }); + //鏄剧ず鍥犲紓甯稿叧闂殑宸℃璁板綍 + function aginShowLocation(lng, lat) { + // 璋冪敤 Android 鎻愪緵鐨勬帴鍙o紝鑾峰彇鏁版嵁 + console.log("aginShowLocation>>lng:" + lng + ">>>lat:" + lat); + var newPoint = new T.LngLat(lng, lat); + aginPath.push(newPoint); + oldLineLayer.setLngLats(aginPath); + map.addOverLay(oldLineLayer); + } + //娓呴櫎宸℃璁板綍杞ㄨ抗 + function cleanLocationLay() { + if (lineLayer) { + map.removeOverLay(lineLayer); + path = [] + } + if (locationMarker) { + map.removeOverLay(locationMarker); + } + if (oldLineLayer) { + aginPath = [] + map.removeOverLay(oldLineLayer); + } + } + //娓呴櫎鏈湴瀹氫綅鍧愭爣浣嶇疆 + function cleanLoclLay() { + if (locationMarker) { + map.removeOverLay(locationMarker); + } + } + + //鏄惁鏄剧ず浜嗗湴鍥句腑蹇冪殑閽堢敤鏉ヤ慨鏀瑰潗鏍� + var isShowCenterPin; + //寮�濮嬭幏鍙栧睆骞曚腑闂村畾浣� + function showPin(lng, lat) { + var newPoint = new T.LngLat(lng, lat); + map.panTo(newPoint); + isShowCenterPin = true; + map.addEventListener("moveend", mapMoveEnd); + window.Android.refreshCenter(map.getCenter().getLng(), map.getCenter().getLat()); + return true; + } + //鍙栨秷淇敼瀹氫綅 + function cancelPin() { + isShowCenterPin = false; + } + + //鎴愬姛淇敼鍙栨按鍙g粡绾害鍚庡埛鏂板彇姘村彛浣嶇疆 + function refreshMarker(id, lng, lat, name) { + map.removeOverLay(lastClickedMarker.label); + map.removeOverLay(lastClickedMarker); + addMarker(id, lng, lat, name, true); + } + + + function mapMoveEnd(e) { + + const center = e.target.getCenter(); + window.Android.refreshCenter(center.getLng(), center.getLat()); + + } + + // 娣诲姞闃叉姈鍑芥暟 + function debounce(fn, delay) { + let timer = null; + return function () { + if (timer) clearTimeout(timer); + timer = setTimeout(() => { + fn.apply(this, arguments); + }, delay); + } + } + + + + // 鍒涘缓marker鍥炬爣鐨勬柟娉曞彲浠ユ娊鍙栧嚭鏉ュ鐢� + function createIcon(iconUrl, size = 28) { + return new T.Icon({ + iconUrl: iconUrl, + iconSize: new T.Point(size, size), + iconAnchor: new T.Point(size / 2, size) + }); + } + //娣诲姞鍒嗘按鎴� + function addDivide(id, lng, lat, name) { + addDivide(id, lng, lat, name, false) + } + //娣诲姞鍒嗘按鎴� + function addDivide(id, lng, lat, name, isRed) { + console.log("function銆嬨�嬨�嬨�嬨�媋ddMarker>>>id:" + id); + + const iconUrl = isRed ? CONFIG.IMAGES.DIVIDE_RED : CONFIG.IMAGES.DIVIDE_BLUE; + let marker = new T.Marker( + new T.LngLat(lng, lat), + { icon: createIcon(iconUrl) } + ); + //娣诲姞鐐瑰嚮浜嬩欢 + marker.addEventListener("click", (data) => { + addDivideListener(id, data) + }); + + let label = new T.Label({ + text: `<div style='position:absolute;left:-50%;transform: translateX(-50%);'>${name}<div>`, + position: marker.getLngLat(), + offset: new T.Point(0, 8), // 璁剧疆鏍囨敞鏂囧瓧鐨勪綅缃� + opacity: 1, // 璁剧疆鏂囨湰鐨勬樉绀轰笉閫忔槑搴︼紙鑼冨洿0-1锛� + }); + label.setBorderLine(0); // 璁剧疆鏂囨湰鐨勮竟妗嗙嚎瀹� + label.setBackgroundColor("transparent"); // 璁剧疆鏂囨湰鐨勮儗鏅壊锛堥�忔槑鑹诧級 + label.setFontColor("#FFFFFF"); + label.setFontSize(10); + marker.label = label; + if (isRed) { + lastClickedMarker = marker; + } + + // 灏嗗垎姘存埧鏍囪鍜屾爣绛惧瓨鍌ㄥ埌鏁扮粍涓� + divideMarkers.push({ + marker: marker, + label: label + }); + + map.addOverLay(label); + map.addOverLay(marker); // 灏嗘爣娉ㄦ坊鍔犲埌鍦板浘涓� + return "addMarker鍔犺浇鎴愬姛 id:" + id + } + // 淇敼鐐瑰嚮鏍囨敞鐨勫浘鏍� + function chageDivideIcon(data) { + // 鐐瑰嚮鐨勬爣娉ㄦ敼涓虹孩鑹� + var currentMarker = data.target; + currentMarker.setIcon(createIcon(CONFIG.IMAGES.DIVIDE_RED)); + + if (lastClickedDivide !== null) { + if (!isEqualsLngLat(data.target.getLngLat(), lastClickedDivide.getLngLat())) { + lastClickedDivide.setIcon(createIcon(CONFIG.IMAGES.DIVIDE_BLUE)); + } + } + if (lastClickedMarker !== null) { + lastClickedMarker.setIcon(createIcon(CONFIG.IMAGES.MARKER_BLUE)); + } + lastClickedDivide = data.target; + map.panTo(currentMarker.getLngLat()); + } + + // 鐐瑰嚮鏍囨敞鐨勪簨浠� + function addDivideListener(id, data) { + // if (!isShowCenterPin) { + chageDivideIcon(data); + showDivideDetail(id); + // } else { + // showToast("褰撳墠姝e湪淇敼閫変腑鍙栨按鍙g殑缁忕含搴︼紝瀹屾垚鎴栭��鍑哄悗鎵嶅彲閫夋嫨鍏朵粬锛�"); + // } + + } + + // 璋冪敤鍘熺敓瀹夊崜鏂规硶鏄剧ず鍙栨按鍙h鎯� + function showDivideDetail(data) { + isShowDivideDetail = true; + window.Android.showDivideDetail(data); + } + + /** + * 闅愯棌鎵�鏈夊彇姘村彛鏍囪 + */ + function hideAllWaterIntakes() { + waterIntakeMarkers.forEach(item => { + map.removeOverLay(item.marker); + map.removeOverLay(item.label); + }); + } + + /** + * 鏄剧ず鎵�鏈夊彇姘村彛鏍囪 + */ + function showAllWaterIntakes() { + waterIntakeMarkers.forEach(item => { + map.addOverLay(item.marker); + map.addOverLay(item.label); + }); + } + + /** + * 闅愯棌鎵�鏈夊垎姘存埧鏍囪 + */ + function hideAllDivides() { + divideMarkers.forEach(item => { + map.removeOverLay(item.marker); + map.removeOverLay(item.label); + }); + } + + /** + * 鏄剧ず鎵�鏈夊垎姘存埧鏍囪 + */ + function showAllDivides() { + divideMarkers.forEach(item => { + map.addOverLay(item.marker); + map.addOverLay(item.label); + }); + } + })(); -- Gitblit v1.8.0