From fbfa859ff0fe312cbb49a3345b6e3d67d574a946 Mon Sep 17 00:00:00 2001
From: zuoxiao <470321431@qq.com>
Date: 星期四, 28 十一月 2024 16:33:37 +0800
Subject: [PATCH] 1.工单列表界面 2.工单详情界面 3.处理工单界面选择图片相关
---
app/src/main/assets/js/map.js | 129 +++++++++++++++++++++++++++++-------------
1 files changed, 89 insertions(+), 40 deletions(-)
diff --git a/app/src/main/assets/js/map.js b/app/src/main/assets/js/map.js
index 8254aa0..a574c9c 100644
--- a/app/src/main/assets/js/map.js
+++ b/app/src/main/assets/js/map.js
@@ -3,12 +3,12 @@
const locationIMGPath = 'img/location.png';
const markerBalckPath = 'img/marker_black.svg';
const markerRedPath = 'img/marker_red.svg';
-
+ const markerBluePath = 'img/marker_blue.svg';
let map;
let lastMarker = null;
let lastClickedMarker = null;
let isShowWaterIntakeDetail = false;
- let zoom=12;
+ let zoom = 12;
document.addEventListener('DOMContentLoaded', function () {
@@ -18,19 +18,28 @@
mountMethodToWindow();
});
- window.onload = function() {
- //鍔犺浇鍧愭爣鐐�
+ 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();
+ //娣诲姞姣斾緥灏烘帶浠�
+ map.addControl(scale);
map.centerAndZoom(new T.LngLat(116.40769, 39.89945), zoom); //鍦板浘鐨勫垵濮嬪寲涓績鐐癸紝姝や负鍖椾含鐨勭粡绾害
map.addEventListener("click", closeWaterIntakeDetail);
}
@@ -89,7 +98,7 @@
for (let i = 0; i < data_info.length; i++) {
let icon = new T.Icon({
- iconUrl: markerBalckPath,
+ iconUrl: markerBluePath,
iconSize: new T.Point(27, 27),
iconAnchor: new T.Point(10, 25)
});
@@ -130,23 +139,34 @@
// 鎵嬫満鑾峰彇鍒板畾浣嶅悗鏄剧ず瀹氫綅
function locationOverLay(lng, lag) {
- map.centerAndZoom(new T.LngLat(lng, lag), 18);
+ console.log("function銆嬨�嬨�嬨�嬨�媗ocationOverLay");
+ 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)
});
-
let marker = new T.Marker(new T.LngLat(lng, lag), { icon: icon });
map.addOverLay(marker);
}
+
+
+ //璁剧疆鍦板浘涓績鐐�
+ 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;
+ window.updateLocation=updateLocation;
}
// 璋冪敤鍘熺敓瀹夊崜鏂规硶鏄剧ず鍙栨按鍙ｈ鎯�
@@ -157,24 +177,24 @@
// 璋冪敤鍘熺敓瀹夊崜鏂规硶闅愯棌鍙栨按鍙ｈ鎯�
function closeWaterIntakeDetail(data) {
- if (lastClickedMarker!== null) {
+ if (lastClickedMarker !== null) {
// 濡傛灉鏈夌偣鍑诲彇姘村彛鍒欏皢鍙栨按鍙ｆ仮澶嶆垚榛戣壊
// 涓婃鐐瑰嚮鐨勬爣娉ㄦ敼涓洪粦鑹�
var defaulticon = new T.Icon({
- iconUrl: markerBalckPath,
- iconSize: new T.Point(27, 27),
- iconAnchor: new T.Point(10, 25)
+ iconUrl: markerBluePath,
+ iconSize: new T.Point(27, 27),
+ iconAnchor: new T.Point(10, 25)
});
lastClickedMarker.setIcon(defaulticon);
- }
- if (isShowWaterIntakeDetail) {
+ }
+ if (isShowWaterIntakeDetail) {
// 鍋囧鏄剧ず浜嗗彇姘村彛璇︽儏鍒欓殣钘忓彇姘村彛璇︽儏
isShowWaterIntakeDetail = false;
window.Android.closeWaterIntakeView();
- } else {
+ } else {
// 鍋囧娌℃湁鏄剧ず鍙栨按鍙ｅ垯娣诲姞鐐瑰嚮鐨勫潗鏍�
getLngLat(data.lnglat);
- }
+ }
}
// 鐐瑰嚮鏍囨敞鐨勪簨浠�
@@ -185,28 +205,28 @@
// 淇敼鐐瑰嚮鏍囨敞鐨勫浘鏍�
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);
- // 鍒ゆ柇鐐瑰嚮鐨勪笉鏄悓涓�涓潗鏍�
- if (lastClickedMarker!== null) {
- if (!isEqualsLngLat(data.target.getLngLat(), lastClickedMarker.getLngLat())) {
- var defaulticon = new T.Icon({
- iconUrl: markerBalckPath,
- iconSize: new T.Point(27, 27),
- iconAnchor: new T.Point(10, 25)
- });
- lastClickedMarker.setIcon(defaulticon);
- }
- }
- lastClickedMarker = data.target;
+ // 鐐瑰嚮鐨勬爣娉ㄦ敼涓虹孩鑹�
+ 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);
+ // 鍒ゆ柇鐐瑰嚮鐨勪笉鏄悓涓�涓潗鏍�
+ 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 = data.target;
}
//璋冨畨鍗撳師鐢�
function showToast() {
@@ -222,7 +242,7 @@
console.log("function銆嬨�嬨�嬨�嬨�媋ddMarker");
var array = JSON.parse(jsonData);
var icon = new T.Icon({
- iconUrl: markerBalckPath,
+ iconUrl: markerBluePath,
iconSize: new T.Point(27, 27),
iconAnchor: new T.Point(10, 25)
});
@@ -235,9 +255,38 @@
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);
});
return "addMarker鍔犺浇鎴愬姛"
+ }
+ //淇濆瓨瀹氫綅鍧愭爣鐢熸垚杞ㄨ抗
+ var path=[];
+ var lineLayer = new T.Polyline([], { color: 'red', weight: 3, opacity: 0.8 });
+
+ function updateLocation(log,lat){
+ var lastLat=lat;
+ const intervalId = setInterval(() => {
+ lastLat=lastLat+0.0001;
+ var newPoint = new T.LngLat(log,lastLat);
+ path.push(newPoint);
+ lineLayer.setLngLats(path);
+ map.addOverLay(lineLayer);
+ // 绉诲姩鍦板浘瑙嗚鍒版渶鍚庝竴涓綅缃�
+ map.panTo(newPoint);
+ }, 500);
+
}
})();
+
\ No newline at end of file
--
Gitblit v1.8.0