地图图表

wujingjing

2024-07-23 5c8a59c4ed5c5f24f93fa10ada21f3501fea220f

地图图表

 src/components/chat/chatComponents/hooks/useDrawChatChart.ts

@@ -33,7 +33,7 @@
            });

            drawChart();
        }, 300);
        }, 100);
    });

    return {

 src/components/chat/chatComponents/mapCom/MapCom.vue

@@ -1,20 +1,69 @@
<template>
    <div ref="containerRef" class="h-[70vh]"></div>
    <div class="h-[70vh] relative">
        <div ref="containerRef" class="h-full"></div>
        <div v-if="bottomBarIsShow" class="absolute w-full bottom-0 bg-white border-gray-300 border border-solid">
            <div
                class="w-28 h-5 absolute left-1/2 -translate-x-1/2 -translate-y-[100%] cursor-pointer bg-[#4974f3] rounded-t-lg flex-center"
                @click="toggleShowChart"
            >
                <div
                    class="ywicon -rotate-90 text-white !text-[13px]"
                    :class="{ 'icon-zuoyoujiantou': chartIsShow, 'icon-zuoyoujiantou1': !chartIsShow }"
                ></div>
            </div>
            <RecordSet v-if="chartIsShow" :data="CHART_DATA" class="h-[23vh] mt-2" />
        </div>
    </div>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { chatComProps } from '../common';
import RecordSet from '../summaryCom/components/recordSet/RecordSet.vue';
import { CHART_DATA } from './TestData';
import monitorPointPic from './img/monitor-point.svg';
import type { MapData } from './types';
import type { GaoDePosition, LabelMarkerData } from '/@/model/map/GaoDeMap';
import { GaoDeMap } from '/@/model/map/GaoDeMap';
import monitorPointPic from './img/monitor-point.svg';

let gaoDeMap = new GaoDeMap();
const containerRef = ref<HTMLDivElement>(null);
const props = defineProps(chatComProps) as {
    data: MapData;
};
const createInfoWindow = () => {
    const dom = `<div class="bg-white p-1 flex flex-col border-blue-500 border-solid border">
            <div class="pointer-title bg-[#ca0dab] flex-center py-1 text-white px-5">
				
            </div>
		
        </div>`;

    // const dom = `<div class="w-32 bg-white p-1 flex flex-col border-blue-500 border-solid border">
    //     <div class="bg-[#ca0dab] flex-center py-1 text-white">
    //         æ°´æœˆäº”
    //     </div>
    //     <div class="flex flex-col mt-2">
    //         <div class="flex w-full text-blue-800">
    //             <div class="overflow-hidden text-nowrap overflow-ellipsis self-end flex-auto text-right">
    //                 0.72332
    //             </div>
    //             <div class="flex-0 ml-4">
    //                 m
    //             </div>

    //         </div>

    //     </div>
    // </div>`;
    return dom;
};

const updateInfoWindow = (title: string) => {
    const pointerTitle = infoWindow.dom.querySelector('.pointer-title');
    pointerTitle.innerHTML = title;
};

const addMarkerLayer = () => {
    const dataList = (props.data?.values ?? []).map<LabelMarkerData>((item) => ({
        position: [item.posx, item.posy],
@@ -28,21 +77,53 @@
                url: monitorPointPic,
                size: 30,
            },
            click(e, label) {
                if (!bottomBarIsShow.value) {
                    bottomBarIsShow.value = true;
                }
                if (!chartIsShow.value) {
                    chartIsShow.value = true;
                }
                infoWindow.open(gaoDeMap.map, label.getPosition() as any);
                const extData = label.getExtData();
                updateInfoWindow(extData.title);

            },
        },
        layerOpt: {
            // allowCollision:false
        },
    });
};
const bottomBarIsShow = ref(false);
const chartIsShow = ref(true);
const toggleShowChart = () => {
    chartIsShow.value = !chartIsShow.value;
};

let infoWindow: AMap.InfoWindow;

onMounted(async () => {
    await gaoDeMap.init({
        container: containerRef.value,
        aMapOption: {
            resizeEnable: true,
        },
    });
    const southWest: GaoDePosition = [props.data.minx, props.data.miny];
    const northEast: GaoDePosition = [props.data.maxx, props.data.maxy];
    gaoDeMap.zoomToRect(southWest, northEast);
    gaoDeMap.applyBasicPlugins();
    addMarkerLayer();
    infoWindow = new AMap.InfoWindow({
        content: createInfoWindow(),
        offset: new AMap.Pixel(0, -18),
        closeWhenClickMap: true,
    });
});
</script>
<style scoped lang="scss"></style>
<style scoped lang="scss">
:deep(.amap-info-content) {
    padding: 0;
}
</style>

 src/components/chat/chatComponents/mapCom/TestData.ts

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,287 @@
export const CHART_DATA = {
    cols: [
        { type: 'time', title: '时间' },
        { type: 'name', title: '名称' },
        { type: 'value', title: '值' },
    ],
    type: 'recordset',
    chart: 'muli_line',
    title: '五一广场DN200瞬时压力',
    values: [
        ['2024-07-20 00:00:00', '五一广场DN200瞬时压力', 23.698],
        ['2024-07-20 00:05:00', '五一广场DN200瞬时压力', 23.62575],
        ['2024-07-20 00:10:00', '五一广场DN200瞬时压力', 23.49825],
        ['2024-07-20 00:15:00', '五一广场DN200瞬时压力', 23.562],
        ['2024-07-20 00:20:00', '五一广场DN200瞬时压力', 23.448667],
        ['2024-07-20 00:25:00', '五一广场DN200瞬时压力', 23.1285],
        ['2024-07-20 00:30:00', '五一广场DN200瞬时压力', 23.188],
        ['2024-07-20 00:35:00', '五一广场DN200瞬时压力', 23.210667],
        ['2024-07-20 00:40:00', '五一广场DN200瞬时压力', 23.26875],
        ['2024-07-20 00:45:00', '五一广场DN200瞬时压力', 23.301333],
        ['2024-07-20 00:50:00', '五一广场DN200瞬时压力', 23.31975],
        ['2024-07-20 00:55:00', '五一广场DN200瞬时压力', 23.3325],
        ['2024-07-20 01:00:00', '五一广场DN200瞬时压力', 23.2662],
        ['2024-07-20 01:05:00', '五一广场DN200瞬时压力', 23.511],
        ['2024-07-20 01:10:00', '五一广场DN200瞬时压力', 23.205],
        ['2024-07-20 01:15:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 01:20:00', '五一广场DN200瞬时压力', 23.57475],
        ['2024-07-20 01:25:00', '五一广场DN200瞬时压力', 23.358],
        ['2024-07-20 01:30:00', '五一广场DN200瞬时压力', 23.686667],
        ['2024-07-20 01:35:00', '五一广场DN200瞬时压力', 23.312667],
        ['2024-07-20 01:40:00', '五一广场DN200瞬时压力', 23.21775],
        ['2024-07-20 01:45:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 01:50:00', '五一广场DN200瞬时压力', 23.426],
        ['2024-07-20 01:55:00', '五一广场DN200瞬时压力', 23.42175],
        ['2024-07-20 02:00:00', '五一广场DN200瞬时压力', 23.62575],
        ['2024-07-20 02:05:00', '五一广场DN200瞬时压力', 23.618667],
        ['2024-07-20 02:10:00', '五一广场DN200瞬时压力', 23.686667],
        ['2024-07-20 02:15:00', '五一广场DN200瞬时压力', 23.715],
        ['2024-07-20 02:20:00', '五一广场DN200瞬时压力', 23.732],
        ['2024-07-20 02:25:00', '五一广场DN200瞬时压力', 23.732],
        ['2024-07-20 02:30:00', '五一广场DN200瞬时压力', 23.7915],
        ['2024-07-20 02:35:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 02:40:00', '五一广场DN200瞬时压力', 23.8],
        ['2024-07-20 02:45:00', '五一广场DN200瞬时压力', 23.82975],
        ['2024-07-20 02:50:00', '五一广场DN200瞬时压力', 23.88075],
        ['2024-07-20 02:55:00', '五一广场DN200瞬时压力', 23.936],
        ['2024-07-20 03:00:00', '五一广场DN200瞬时压力', 23.93175],
        ['2024-07-20 03:05:00', '五一广场DN200瞬时压力', 23.9292],
        ['2024-07-20 03:10:00', '五一广场DN200瞬时压力', 23.9445],
        ['2024-07-20 03:15:00', '五一广场DN200瞬时压力', 23.95725],
        ['2024-07-20 03:20:00', '五一广场DN200瞬时压力', 23.947333],
        ['2024-07-20 03:25:00', '五一广场DN200瞬时压力', 23.924667],
        ['2024-07-20 03:30:00', '五一广场DN200瞬时压力', 23.90625],
        ['2024-07-20 03:35:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 03:40:00', '五一广场DN200瞬时压力', 23.890667],
        ['2024-07-20 03:45:00', '五一广场DN200瞬时压力', 23.890667],
        ['2024-07-20 03:50:00', '五一广场DN200瞬时压力', 23.97],
        ['2024-07-20 03:55:00', '五一广场DN200瞬时压力', 23.981333],
        ['2024-07-20 04:00:00', '五一广场DN200瞬时压力', 23.856667],
        ['2024-07-20 04:05:00', '五一广场DN200瞬时压力', 23.90625],
        ['2024-07-20 04:10:00', '五一广场DN200瞬时压力', 23.924667],
        ['2024-07-20 04:15:00', '五一广场DN200瞬时压力', 23.95725],
        ['2024-07-20 04:20:00', '五一广场DN200瞬时压力', 23.77875],
        ['2024-07-20 04:25:00', '五一广场DN200瞬时压力', 23.7966],
        ['2024-07-20 04:30:00', '五一广场DN200瞬时压力', 23.70225],
        ['2024-07-20 04:35:00', '五一广场DN200瞬时压力', 23.80425],
        ['2024-07-20 04:40:00', '五一广场DN200瞬时压力', 23.8068],
        ['2024-07-20 04:45:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 04:50:00', '五一广场DN200瞬时压力', 23.95725],
        ['2024-07-20 04:55:00', '五一广场DN200瞬时压力', 23.811333],
        ['2024-07-20 05:00:00', '五一广场DN200瞬时压力', 23.777333],
        ['2024-07-20 05:05:00', '五一广场DN200瞬时压力', 23.7915],
        ['2024-07-20 05:10:00', '五一广场DN200瞬时压力', 23.67675],
        ['2024-07-20 05:15:00', '五一广场DN200瞬时压力', 23.664],
        ['2024-07-20 05:20:00', '五一广场DN200瞬时压力', 23.46],
        ['2024-07-20 05:25:00', '五一广场DN200瞬时压力', 23.37075],
        ['2024-07-20 05:30:00', '五一广场DN200瞬时压力', 23.335333],
        ['2024-07-20 05:35:00', '五一广场DN200瞬时压力', 23.414667],
        ['2024-07-20 05:40:00', '五一广场DN200瞬时压力', 23.34525],
        ['2024-07-20 05:45:00', '五一广场DN200瞬时压力', 23.335333],
        ['2024-07-20 05:50:00', '五一广场DN200瞬时压力', 23.26875],
        ['2024-07-20 05:55:00', '五一广场DN200瞬时压力', 23.34525],
        ['2024-07-20 06:00:00', '五一广场DN200瞬时压力', 23.312667],
        ['2024-07-20 06:05:00', '五一广场DN200瞬时压力', 23.21775],
        ['2024-07-20 06:10:00', '五一广场DN200瞬时压力', 23.1285],
        ['2024-07-20 06:15:00', '五一广场DN200瞬时压力', 23.103],
        ['2024-07-20 06:20:00', '五一广场DN200瞬时压力', 23.0265],
        ['2024-07-20 06:25:00', '五一广场DN200瞬时压力', 23.21775],
        ['2024-07-20 06:30:00', '五一广场DN200瞬时压力', 23.1642],
        ['2024-07-20 06:35:00', '五一广场DN200瞬时压力', 23.11575],
        ['2024-07-20 06:40:00', '五一广场DN200瞬时压力', 23.11575],
        ['2024-07-20 06:45:00', '五一广场DN200瞬时压力', 23.142667],
        ['2024-07-20 06:50:00', '五一广场DN200瞬时压力', 23.369333],
        ['2024-07-20 06:55:00', '五一广场DN200瞬时压力', 23.4345],
        ['2024-07-20 07:00:00', '五一广场DN200瞬时压力', 23.6385],
        ['2024-07-20 07:05:00', '五一广场DN200瞬时压力', 23.573333],
        ['2024-07-20 07:10:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 07:15:00', '五一广场DN200瞬时压力', 23.722286],
        ['2024-07-20 07:20:00', '五一广场DN200瞬时压力', 23.698],
        ['2024-07-20 07:25:00', '五一广场DN200瞬时压力', 23.5365],
        ['2024-07-20 07:30:00', '五一广场DN200瞬时压力', 23.52375],
        ['2024-07-20 07:35:00', '五一广场DN200瞬时压力', 23.539333],
        ['2024-07-20 07:40:00', '五一广场DN200瞬时压力', 23.7405],
        ['2024-07-20 07:45:00', '五一广场DN200瞬时压力', 23.54925],
        ['2024-07-20 07:50:00', '五一广场DN200瞬时压力', 23.5926],
        ['2024-07-20 07:55:00', '五一广场DN200瞬时压力', 23.31975],
        ['2024-07-20 08:00:00', '五一广场DN200瞬时压力', 23.39625],
        ['2024-07-20 08:05:00', '五一广场DN200瞬时压力', 23.46],
        ['2024-07-20 08:10:00', '五一广场DN200瞬时压力', 23.21775],
        ['2024-07-20 08:15:00', '五一广场DN200瞬时压力', 23.409],
        ['2024-07-20 08:20:00', '五一广场DN200瞬时压力', 23.063333],
        ['2024-07-20 08:25:00', '五一广场DN200瞬时压力', 23.301333],
        ['2024-07-20 08:30:00', '五一广场DN200瞬时压力', 23.1795],
        ['2024-07-20 08:35:00', '五一广场DN200瞬时压力', 23.21775],
        ['2024-07-20 08:40:00', '五一广场DN200瞬时压力', 22.972667],
        ['2024-07-20 08:45:00', '五一广场DN200瞬时压力', 23.108667],
        ['2024-07-20 08:50:00', '五一广场DN200瞬时压力', 22.9245],
        ['2024-07-20 08:55:00', '五一广场DN200瞬时压力', 22.836667],
        ['2024-07-20 09:00:00', '五一广场DN200瞬时压力', 22.791333],
        ['2024-07-20 09:05:00', '五一广场DN200瞬时压力', 22.75875],
        ['2024-07-20 09:10:00', '五一广场DN200瞬时压力', 22.870667],
        ['2024-07-20 09:15:00', '五一广场DN200瞬时压力', 22.78],
        ['2024-07-20 09:20:00', '五一广场DN200瞬时压力', 22.91175],
        ['2024-07-20 09:25:00', '五一广场DN200瞬时压力', 23.018],
        ['2024-07-20 09:30:00', '五一广场DN200瞬时压力', 22.9245],
        ['2024-07-20 09:35:00', '五一广场DN200瞬时压力', 22.86075],
        ['2024-07-20 09:40:00', '五一广场DN200瞬时压力', 22.6644],
        ['2024-07-20 09:45:00', '五一广场DN200瞬时压力', 22.83525],
        ['2024-07-20 09:50:00', '五一广场DN200瞬时压力', 22.98825],
        ['2024-07-20 09:55:00', '五一广场DN200瞬时压力', 23.1744],
        ['2024-07-20 10:00:00', '五一广场DN200瞬时压力', 22.98825],
        ['2024-07-20 10:05:00', '五一广场DN200瞬时压力', 23.2815],
        ['2024-07-20 10:10:00', '五一广场DN200瞬时压力', 23.312667],
        ['2024-07-20 10:15:00', '五一广场DN200瞬时压力', 23.301333],
        ['2024-07-20 10:20:00', '五一广场DN200瞬时压力', 23.29425],
        ['2024-07-20 10:25:00', '五一广场DN200瞬时压力', 23.26875],
        ['2024-07-20 10:30:00', '五一广场DN200瞬时压力', 23.358],
        ['2024-07-20 10:35:00', '五一广场DN200瞬时压力', 23.267333],
        ['2024-07-20 10:40:00', '五一广场DN200瞬时压力', 23.29425],
        ['2024-07-20 10:45:00', '五一广场DN200瞬时压力', 23.346667],
        ['2024-07-20 10:50:00', '五一广场DN200瞬时压力', 23.256],
        ['2024-07-20 10:55:00', '五一广场DN200瞬时压力', 23.29425],
        ['2024-07-20 11:00:00', '五一广场DN200瞬时压力', 23.176667],
        ['2024-07-20 11:05:00', '五一广场DN200瞬时压力', 23.19225],
        ['2024-07-20 11:10:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 11:15:00', '五一广场DN200瞬时压力', 23.2662],
        ['2024-07-20 11:20:00', '五一广场DN200瞬时压力', 23.2305],
        ['2024-07-20 11:25:00', '五一广场DN200瞬时压力', 23.24325],
        ['2024-07-20 11:30:00', '五一广场DN200瞬时压力', 23.2152],
        ['2024-07-20 11:35:00', '五一广场DN200瞬时压力', 23.205],
        ['2024-07-20 11:40:00', '五一广场DN200瞬时压力', 23.19225],
        ['2024-07-20 11:45:00', '五一广场DN200瞬时压力', 23.233333],
        ['2024-07-20 11:50:00', '五一广场DN200瞬时压力', 23.233333],
        ['2024-07-20 11:55:00', '五一广场DN200瞬时压力', 23.2815],
        ['2024-07-20 12:00:00', '五一广场DN200瞬时压力', 23.154],
        ['2024-07-20 12:05:00', '五一广场DN200瞬时压力', 23.233333],
        ['2024-07-20 12:10:00', '五一广场DN200瞬时压力', 23.244667],
        ['2024-07-20 12:15:00', '五一广场DN200瞬时压力', 23.2305],
        ['2024-07-20 12:20:00', '五一广场DN200瞬时压力', 23.324],
        ['2024-07-20 12:25:00', '五一广场DN200瞬时压力', 23.097333],
        ['2024-07-20 12:30:00', '五一广场DN200瞬时压力', 23.16675],
        ['2024-07-20 12:35:00', '五一广场DN200瞬时压力', 23.244667],
        ['2024-07-20 12:40:00', '五一广场DN200瞬时压力', 23.26875],
        ['2024-07-20 12:45:00', '五一广场DN200瞬时压力', 23.24325],
        ['2024-07-20 12:50:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 12:55:00', '五一广场DN200瞬时压力', 23.369333],
        ['2024-07-20 13:00:00', '五一广场DN200瞬时压力', 23.3325],
        ['2024-07-20 13:05:00', '五一广场DN200瞬时压力', 23.2866],
        ['2024-07-20 13:10:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 13:15:00', '五一广场DN200瞬时压力', 23.409],
        ['2024-07-20 13:20:00', '五一广场DN200瞬时压力', 23.409],
        ['2024-07-20 13:25:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 13:30:00', '五一广场DN200瞬时压力', 23.4855],
        ['2024-07-20 13:35:00', '五一广场DN200瞬时压力', 23.573333],
        ['2024-07-20 13:40:00', '五一广场DN200瞬时压力', 23.426],
        ['2024-07-20 13:45:00', '五一广场DN200瞬时压力', 23.82975],
        ['2024-07-20 13:50:00', '五一广场DN200瞬时压力', 23.919],
        ['2024-07-20 13:55:00', '五一广场DN200瞬时压力', 23.573333],
        ['2024-07-20 14:00:00', '五一广场DN200瞬时压力', 23.754667],
        ['2024-07-20 14:05:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 14:10:00', '五一广场DN200瞬时压力', 23.584667],
        ['2024-07-20 14:15:00', '五一广场DN200瞬时压力', 23.46],
        ['2024-07-20 14:20:00', '五一广场DN200瞬时压力', 23.7405],
        ['2024-07-20 14:25:00', '五一广场DN200瞬时压力', 23.732],
        ['2024-07-20 14:30:00', '五一广场DN200瞬时压力', 23.75325],
        ['2024-07-20 14:35:00', '五一广场DN200瞬时压力', 23.65125],
        ['2024-07-20 14:40:00', '五一广场DN200瞬时压力', 23.664],
        ['2024-07-20 14:45:00', '五一广场DN200瞬时压力', 23.72775],
        ['2024-07-20 14:50:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 14:55:00', '五一广场DN200瞬时压力', 23.8068],
        ['2024-07-20 15:00:00', '五一广场DN200瞬时压力', 23.817],
        ['2024-07-20 15:05:00', '五一广场DN200瞬时压力', 23.75325],
        ['2024-07-20 15:10:00', '五一广场DN200瞬时压力', 23.766],
        ['2024-07-20 15:15:00', '五一广场DN200瞬时压力', 23.822667],
        ['2024-07-20 15:20:00', '五一广场DN200瞬时压力', 23.70225],
        ['2024-07-20 15:25:00', '五一广场DN200瞬时压力', 23.62575],
        ['2024-07-20 15:30:00', '五一广场DN200瞬时压力', 23.618667],
        ['2024-07-20 15:35:00', '五一广场DN200瞬时压力', 23.49825],
        ['2024-07-20 15:40:00', '五一广场DN200瞬时压力', 23.664],
        ['2024-07-20 15:45:00', '五一广场DN200瞬时压力', 23.698],
        ['2024-07-20 15:50:00', '五一广场DN200瞬时压力', 23.664],
        ['2024-07-20 15:55:00', '五一广场DN200瞬时压力', 23.62575],
        ['2024-07-20 16:00:00', '五一广场DN200瞬时压力', 23.550667],
        ['2024-07-20 16:05:00', '五一广场DN200瞬时压力', 23.49825],
        ['2024-07-20 16:10:00', '五一广场DN200瞬时压力', 23.52375],
        ['2024-07-20 16:15:00', '五一广场DN200瞬时压力', 23.550667],
        ['2024-07-20 16:20:00', '五一广场DN200瞬时压力', 23.47275],
        ['2024-07-20 16:25:00', '五一广场DN200瞬时压力', 23.52375],
        ['2024-07-20 16:30:00', '五一广场DN200瞬时压力', 23.4906],
        ['2024-07-20 16:35:00', '五一广场DN200瞬时压力', 23.511],
        ['2024-07-20 16:40:00', '五一广场DN200瞬时压力', 23.511],
        ['2024-07-20 16:45:00', '五一广场DN200瞬时压力', 23.539333],
        ['2024-07-20 16:50:00', '五一广场DN200瞬时压力', 23.607333],
        ['2024-07-20 16:55:00', '五一广场DN200瞬时压力', 23.60025],
        ['2024-07-20 17:00:00', '五一广场DN200瞬时压力', 23.618667],
        ['2024-07-20 17:05:00', '五一广场DN200瞬时压力', 23.63],
        ['2024-07-20 17:10:00', '五一广场DN200瞬时压力', 23.5365],
        ['2024-07-20 17:15:00', '五一广场DN200瞬时压力', 23.57475],
        ['2024-07-20 17:20:00', '五一广场DN200瞬时压力', 23.562],
        ['2024-07-20 17:25:00', '五一广场DN200瞬时压力', 23.437333],
        ['2024-07-20 17:30:00', '五一广场DN200瞬时压力', 23.29425],
        ['2024-07-20 17:35:00', '五一广场DN200瞬时压力', 23.414667],
        ['2024-07-20 17:40:00', '五一广场DN200瞬时压力', 23.39625],
        ['2024-07-20 17:45:00', '五一广场DN200瞬时压力', 23.409],
        ['2024-07-20 17:50:00', '五一广场DN200瞬时压力', 23.375],
        ['2024-07-20 17:55:00', '五一广场DN200瞬时压力', 23.256],
        ['2024-07-20 18:00:00', '五一广场DN200瞬时压力', 23.31975],
        ['2024-07-20 18:05:00', '五一广场DN200瞬时压力', 23.2458],
        ['2024-07-20 18:10:00', '五一广场DN200瞬时压力', 23.3835],
        ['2024-07-20 18:15:00', '五一广场DN200瞬时压力', 23.256],
        ['2024-07-20 18:20:00', '五一广场DN200瞬时压力', 23.3478],
        ['2024-07-20 18:25:00', '五一广场DN200瞬时压力', 23.154],
        ['2024-07-20 18:30:00', '五一广场DN200瞬时压力', 23.31975],
        ['2024-07-20 18:35:00', '五一广场DN200瞬时压力', 23.12],
        ['2024-07-20 18:40:00', '五一广场DN200瞬时压力', 23.165333],
        ['2024-07-20 18:45:00', '五一广场DN200瞬时压力', 23.212286],
        ['2024-07-20 19:55:00', '五一广场DN200瞬时压力', 23.494],
        ['2024-07-20 20:00:00', '五一广场DN200瞬时压力', 23.54925],
        ['2024-07-20 20:05:00', '五一广场DN200瞬时压力', 23.57475],
        ['2024-07-20 20:10:00', '五一广场DN200瞬时压力', 23.63],
        ['2024-07-20 20:15:00', '五一广场DN200瞬时压力', 23.528],
        ['2024-07-20 20:20:00', '五一广场DN200瞬时压力', 23.29425],
        ['2024-07-20 20:25:00', '五一广场DN200瞬时压力', 23.52375],
        ['2024-07-20 20:30:00', '五一广场DN200瞬时压力', 23.244667],
        ['2024-07-20 20:35:00', '五一广场DN200瞬时压力', 23.24325],
        ['2024-07-20 20:40:00', '五一广场DN200瞬时压力', 23.21775],
        ['2024-07-20 20:45:00', '五一广场DN200瞬时压力', 22.95],
        ['2024-07-20 20:50:00', '五一广场DN200瞬时压力', 23.176667],
        ['2024-07-20 20:55:00', '五一广场DN200瞬时压力', 23.11575],
        ['2024-07-20 21:00:00', '五一广场DN200瞬时压力', 23.12],
        ['2024-07-20 21:05:00', '五一广场DN200瞬时压力', 23.03925],
        ['2024-07-20 21:10:00', '五一广场DN200瞬时压力', 23.06475],
        ['2024-07-20 21:15:00', '五一广场DN200瞬时压力', 23.108667],
        ['2024-07-20 21:20:00', '五一广场DN200瞬时压力', 22.9245],
        ['2024-07-20 21:25:00', '五一广场DN200瞬时压力', 22.95],
        ['2024-07-20 21:30:00', '五一广场DN200瞬时压力', 22.9704],
        ['2024-07-20 21:35:00', '五一广场DN200瞬时压力', 23.001],
        ['2024-07-20 21:40:00', '五一广场DN200瞬时压力', 22.91175],
        ['2024-07-20 21:45:00', '五一广场DN200瞬时压力', 23.0826],
        ['2024-07-20 21:50:00', '五一广场DN200瞬时压力', 23.103],
        ['2024-07-20 21:55:00', '五一广场DN200瞬时压力', 23.307],
        ['2024-07-20 22:00:00', '五一广场DN200瞬时压力', 23.086],
        ['2024-07-20 22:05:00', '五一广场DN200瞬时压力', 22.961333],
        ['2024-07-20 22:10:00', '五一广场DN200瞬时压力', 22.9245],
        ['2024-07-20 22:15:00', '五一广场DN200瞬时压力', 22.9755],
        ['2024-07-20 22:20:00', '五一广场DN200瞬时压力', 23.052],
        ['2024-07-20 22:25:00', '五一广场DN200瞬时压力', 23.052],
        ['2024-07-20 22:30:00', '五一广场DN200瞬时压力', 23.1285],
        ['2024-07-20 22:35:00', '五一广场DN200瞬时压力', 23.188],
        ['2024-07-20 22:40:00', '五一广场DN200瞬时压力', 23.12],
        ['2024-07-20 22:45:00', '五一广场DN200瞬时压力', 23.14125],
        ['2024-07-20 22:50:00', '五一广场DN200瞬时压力', 23.063333],
        ['2024-07-20 22:55:00', '五一广场DN200瞬时压力', 23.154],
        ['2024-07-20 23:00:00', '五一广场DN200瞬时压力', 23.285143],
        ['2024-07-20 23:05:00', '五一广场DN200瞬时压力', 23.1846],
        ['2024-07-20 23:10:00', '五一广场DN200瞬时压力', 23.2815],
        ['2024-07-20 23:15:00', '五一广场DN200瞬时压力', 23.358],
        ['2024-07-20 23:20:00', '五一广场DN200瞬时压力', 23.4396],
        ['2024-07-20 23:25:00', '五一广场DN200瞬时压力', 23.3325],
        ['2024-07-20 23:30:00', '五一广场DN200瞬时压力', 23.4345],
        ['2024-07-20 23:35:00', '五一广场DN200瞬时压力', 23.437333],
        ['2024-07-20 23:40:00', '五一广场DN200瞬时压力', 23.437333],
        ['2024-07-20 23:45:00', '五一广场DN200瞬时压力', 23.49825],
        ['2024-07-20 23:50:00', '五一广场DN200瞬时压力', 23.256],
        ['2024-07-20 23:55:00', '五一广场DN200瞬时压力', 23.46],
    ],
};

 src/model/map/GaoDeMap.ts

@@ -7,7 +7,7 @@
    version?: string;
    plugins?: string[];
    container: string | HTMLDivElement;
    aMapOption?: Partial<AMap.MapOptions>;
    aMapOption?: Partial<AMap.MapOptions> & Record<string, any>;
};

export type GaoDeMarkerOption = {
@@ -15,6 +15,7 @@
        url: string;
        size: number;
    };
    click?: (e: any, labelMarker: AMap.LabelMarker) => void;
};
export type LabelMarkerData = {
    position: GaoDePosition;
@@ -59,11 +60,22 @@
                plugins: gaoDeOption.plugins,
            });
            this.map = new AMap.Map(gaoDeOption.container, gaoDeOption.aMapOption);
            this.setStyle();
        } catch (error) {
            // console.error(error);
        }
    }
    constructor() {}

    private setStyle() {
        const container = this.map.getContainer() as any;
        /**
         * éšè—é«˜å¾·ç›¸å…³æ ‡å¿—
         */
        container.querySelector('.amap-logo').style.opacity = 0;
        container.querySelector('.amap-copyright').style.opacity = 0;

    }

    zoomToRect(southWest: GaoDePosition, northEast: GaoDePosition) {
        if (!this.viewBound) {
@@ -92,10 +104,9 @@
        } as MarkerLayerOption) as MarkerLayerOption;

        const layer = new AMap.LabelsLayer(markerLayerOption.layerOpt);
        let convertData = (dataList ?? []).map<AMap.LabelMarkerOptions>((item) => {
            const {
                markerOpt: { icon },
            } = markerLayerOption;
        const { markerOpt } = markerLayerOption;
        const convertData = (dataList ?? []).map<AMap.LabelMarkerOptions>((item) => {
            const { icon } = markerOpt;
            return {
                // name: '自提点9',
                position: item.position,
@@ -128,7 +139,14 @@
                extData: item.extData,
            };
        });
        const markerList = convertData.map((item) => new AMap.LabelMarker(item));
        const markerList = convertData.map((item) => {
            const label = new AMap.LabelMarker(item);
            if (markerOpt.click) {
                label.on('click', (e) => markerOpt.click(e, label));
            }
            return label;
        });

        layer.add(markerList);
        this.map.add(layer);
    }