1.分水房相关 2.删除极光推送相关配置 3.优化图片显示相关

zuoxiao

2025-01-13 50f9b82ac862652e88444d727a32e0da1d824e9e

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

@@ -1,10 +1,18 @@
(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 centerPin = 'img/push_pin.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'
        },
        MAP: {
            DEFAULT_ZOOM: 12,
            TIANDITU_KEY: 'd8beed89b43160a9a185e5aff431f85d'
        }
    };
    let map;
    let lastMarker = null;
    let lastClickedMarker = null;
@@ -115,13 +123,15 @@
    function locationOverLay(lng, lag) {
        console.log("function》》》》》locationOverLay");
        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);
    }

@@ -146,14 +156,7 @@
    function closeWaterIntakeDetail(data) {
        if (!isShowCenterPin) {
            if (lastClickedMarker !== null) {
                // 如果有点击取水口则将取水口恢复成黑色
                // 上次点击的标注改为黑色
                var defaulticon = new T.Icon({
                    iconUrl: markerBluePath,
                    iconSize: new T.Point(28, 28),
                    iconAnchor: new T.Point(14, 28)
                });
                lastClickedMarker.setIcon(defaulticon);
                lastClickedMarker.setIcon(createIcon(CONFIG.IMAGES.MARKER_BLUE));
            }
            if (isShowWaterIntakeDetail) {
                // 假如显示了取水口详情则隐藏取水口详情
@@ -172,6 +175,8 @@
        if (!isShowCenterPin) {
            chageMarkerIcon(data);
            showWaterIntakeDetail(id);
        }else {
            showToast("当前正在修改选中取水口的经纬度，完成或退出后才可选择其他！");
        }

    }
@@ -180,32 +185,20 @@
    function chageMarkerIcon(data) {
        // 点击的标注改为红色
        var currentMarker = data.target;
        // 点击后图标
        var clickedIcon = new T.Icon({
            iconUrl: markerRedPath,
            iconSize: new T.Point(28, 28),
            iconAnchor: new T.Point(14, 28)
        });
        // 设置当前点击的 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(28, 28),
                    iconAnchor: new T.Point(14, 28)
                });
                lastClickedMarker.setIcon(defaulticon);
                lastClickedMarker.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) {
@@ -218,20 +211,11 @@
    function addMarker(id, lng, lat, name, isRed) {
        console.log("function》》》》》addMarker>>>id:" + id);

        var iconUrl;
        if (isRed) {
            iconUrl = markerRedPath;
        } else {
            iconUrl = markerBluePath;
        }
        var icon = new T.Icon({
            iconUrl: iconUrl,
            iconSize: new T.Point(28, 28),
            iconAnchor: new T.Point(14, 28)
        });
        const iconUrl = isRed ? CONFIG.IMAGES.MARKER_RED : CONFIG.IMAGES.MARKER_BLUE;
        let marker = new T.Marker(
            new T.LngLat(lng, lat) // 创建标注
            , { icon: icon });
            new T.LngLat(lng, lat),
            { icon: createIcon(iconUrl) }
        );
        //添加点击事件
        marker.addEventListener("click", (data) => {
            addMarkerListener(id, data)
@@ -255,24 +239,28 @@
        map.addOverLay(marker); // 将标注添加到地图中
        return "addMarker加载成功 id:" + id
    }
    //更新定位坐标
    //更新位坐标
    function updateLocation(log, lat) {
        let icon = new T.Icon({
            iconUrl: locationIMGPath,
            iconSize: new T.Point(20, 20),
            iconAnchor: new T.Point(10, 10)
        });
        if (locationMarker) {
            map.removeOverLay(locationMarker);
        }
        var newPoint = new T.LngLat(log, lat);
        locationMarker = new T.Marker(newPoint, { icon: icon });
        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: '#ff4500', weight: 3, opacity: 0.8 });
    var lineLayer = new T.Polyline([], { color: '#E9900A', weight: 3, opacity: 0.8 });
    let locationMarker;
    function updateInspectionLocation(log, lat) {
        var lastLat = lat;
@@ -288,7 +276,7 @@
    }

    var aginPath = [];
    var oldLineLayer = new T.Polyline([], { color: '#ff4500', weight: 3, opacity: 0.8 });
    var oldLineLayer = new T.Polyline([], { color: '#E9900A', weight: 3, opacity: 0.8 });
    //显示因异常关闭的巡检记录
    function aginShowLocation(lng, lat) {
        // 调用 Android 提供的接口，获取数据
@@ -328,7 +316,7 @@
        isShowCenterPin = true;
        map.addEventListener("moveend", mapMoveEnd);
        window.Android.refreshCenter(map.getCenter().getLng(), map.getCenter().getLat());

       return true;
    }
    //取消修改定位
    function cancelPin() {
@@ -344,9 +332,32 @@


    function mapMoveEnd(e) {
        var center = e.target.getCenter();
        console.log("lng:" + center.getLng() + "   lat:" + center.getLat())
        window.Android.refreshCenter(center.getLng(), center.getLat());
        debounce(() => {
            const center = e.target.getCenter();
            window.Android.refreshCenter(center.getLng(), center.getLat());
        }, 300);
    }

    // 添加防抖函数
    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)
        });
    }

})();