地图添加巡检定位功能

zuoxiao

2024-11-13 e7df063a027c0f066317da4437d01cf3f3bc8d31

 app/src/main/assets/js/map.js

@@ -24,13 +24,22 @@
    };
    // 初始化地图
    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);
    }
@@ -131,21 +140,21 @@
    // 手机获取到定位后显示定位
    function locationOverLay(lng, lag) {
        console.log("function》》》》》locationOverLay");
        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)
        });

        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》》》》》setCenterAndZoom>>>>lng:" + lng + ",lat:" + lat);
        map.centerAndZoom(new T.LngLat(lng, lat), zoom);
    }
@@ -157,6 +166,7 @@
        window.showToast = showToast;
        window.addMarker = addMarker;
        window.setCenterAndZoom = setCenterAndZoom;
        window.updateLocation=updateLocation;
    }

    // 调用原生安卓方法显示取水口详情
@@ -250,7 +260,7 @@
                position: marker.getLngLat(),
                offset: new T.Point(-35, 8), // 设置标注文字的位置
                opacity: 1, // 设置文本的显示不透明度（范围0-1）
            });
                    });
            label.setBorderLine(0); // 设置文本的边框线宽
            label.setBackgroundColor("transparent"); // 设置文本的背景色（透明色）
            label.setFontColor("#0000FF");
@@ -259,6 +269,21 @@
        });
        return "addMarker加载成功"
    }
    //保存定位坐标生成轨迹
    var path=[];
    function updateLocation(lat,log){
        var newPoint = new T.LatLng(latitude, longitude);
        path.push(newPoint);
        var polyline = new T.Polyline({
            path: path,  // 轨迹坐标
            strokeColor: "#FF0000",  // 轨迹颜色
            strokeWeight: 6,  // 轨迹线宽
            strokeOpacity: 0.7  // 轨迹透明度
        });
        map.addOverlay(polyline);
         // 移动地图视角到最后一个位置
         map.panTo(newPoint);
    }


})();