From 9910a7a2ba7c57dc930f6077f1e83958e35f8e15 Mon Sep 17 00:00:00 2001 From: yzg1025 Date: Tue, 19 Dec 2023 17:28:06 +0800 Subject: [PATCH 1/4] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E8=B7=AF?= =?UTF-8?q?=E7=94=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 10 ++- package-lock.json | 63 ++++++++++++- package.json | 3 +- src/App.css | 39 -------- src/App.tsx | 50 ----------- src/components/data-assets/index.module.less | 5 ++ src/components/data-assets/index.tsx | 8 ++ .../data-panel/index.module.less | 7 ++ .../data-retrieval/data-panel/index.tsx | 7 ++ .../data-retrieval/index.module.less | 11 +++ src/components/data-retrieval/index.tsx | 27 ++++++ .../data-retrieval/map-layer/constants.ts | 38 ++++++++ .../map-layer/index.module.less | 70 +++++++++++++++ .../data-retrieval/map-layer/index.tsx | 89 +++++++++++++++++++ src/components/layout/index.module.less | 37 ++++++++ src/components/layout/index.tsx | 56 ++++++++++++ src/main.tsx | 16 +++- vite.config.ts | 13 ++- 18 files changed, 451 insertions(+), 98 deletions(-) delete mode 100644 src/App.css delete mode 100644 src/App.tsx create mode 100644 src/components/data-assets/index.module.less create mode 100644 src/components/data-assets/index.tsx create mode 100644 src/components/data-retrieval/data-panel/index.module.less create mode 100644 src/components/data-retrieval/data-panel/index.tsx create mode 100644 src/components/data-retrieval/index.module.less create mode 100644 src/components/data-retrieval/index.tsx create mode 100644 src/components/data-retrieval/map-layer/constants.ts create mode 100644 src/components/data-retrieval/map-layer/index.module.less create mode 100644 src/components/data-retrieval/map-layer/index.tsx create mode 100644 src/components/layout/index.module.less create mode 100644 src/components/layout/index.tsx diff --git a/index.html b/index.html index e4b78ea..f966c6e 100644 --- a/index.html +++ b/index.html @@ -1,10 +1,14 @@ - + - + - Vite + React + TS + 遥感产品数据云
diff --git a/package-lock.json b/package-lock.json index 124be42..3278926 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,8 @@ "@antv/larkmap": "^1.4.10", "antd": "^5.12.2", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "react-router-dom": "^6.21.0" }, "devDependencies": { "@types/react": "^18.2.43", @@ -1604,6 +1605,14 @@ "react-dom": ">=16.9.0" } }, + "node_modules/@remix-run/router": { + "version": "1.14.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.0.tgz", + "integrity": "sha512-WOHih+ClN7N8oHk9N4JUiMxQJmRVaOxcg8w7F/oHUXzJt920ekASLI/7cYX8XkntDWRhLZtsk6LbGrkgOAvi5A==", + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.9.1", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.1.tgz", @@ -6825,6 +6834,36 @@ "node": ">=0.10.0" } }, + "node_modules/react-router": { + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.0.tgz", + "integrity": "sha512-hGZ0HXbwz3zw52pLZV3j3+ec+m/PQ9cTpBvqjFQmy2XVUWGn5MD+31oXHb6dVTxYzmAeaiUBYjkoNz66n3RGCg==", + "dependencies": { + "@remix-run/router": "1.14.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.0.tgz", + "integrity": "sha512-1dUdVj3cwc1npzJaf23gulB562ESNvxf7E4x8upNJycqyUm5BRRZ6dd3LrlzhtLaMrwOCO8R0zoiYxdaJx4LlQ==", + "dependencies": { + "@remix-run/router": "1.14.0", + "react-router": "6.21.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/reflect-metadata": { "version": "0.1.14", "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", @@ -8824,6 +8863,11 @@ "rc-util": "^5.38.0" } }, + "@remix-run/router": { + "version": "1.14.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.0.tgz", + "integrity": "sha512-WOHih+ClN7N8oHk9N4JUiMxQJmRVaOxcg8w7F/oHUXzJt920ekASLI/7cYX8XkntDWRhLZtsk6LbGrkgOAvi5A==" + }, "@rollup/rollup-android-arm-eabi": { "version": "4.9.1", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.1.tgz", @@ -12753,6 +12797,23 @@ "integrity": "sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==", "dev": true }, + "react-router": { + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.0.tgz", + "integrity": "sha512-hGZ0HXbwz3zw52pLZV3j3+ec+m/PQ9cTpBvqjFQmy2XVUWGn5MD+31oXHb6dVTxYzmAeaiUBYjkoNz66n3RGCg==", + "requires": { + "@remix-run/router": "1.14.0" + } + }, + "react-router-dom": { + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.0.tgz", + "integrity": "sha512-1dUdVj3cwc1npzJaf23gulB562ESNvxf7E4x8upNJycqyUm5BRRZ6dd3LrlzhtLaMrwOCO8R0zoiYxdaJx4LlQ==", + "requires": { + "@remix-run/router": "1.14.0", + "react-router": "6.21.0" + } + }, "reflect-metadata": { "version": "0.1.14", "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", diff --git a/package.json b/package.json index 9e6f3b7..da16e4e 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,8 @@ "@antv/larkmap": "^1.4.10", "antd": "^5.12.2", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "react-router-dom": "^6.21.0" }, "devDependencies": { "@types/react": "^18.2.43", diff --git a/src/App.css b/src/App.css deleted file mode 100644 index 5b8bf03..0000000 --- a/src/App.css +++ /dev/null @@ -1,39 +0,0 @@ -#root { - text-align: center; -} - -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: filter 300ms; -} -.logo:hover { - filter: drop-shadow(0 0 2em #646cffaa); -} -.logo.react:hover { - filter: drop-shadow(0 0 2em #61dafbaa); -} - -@keyframes logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} - -@media (prefers-reduced-motion: no-preference) { - a:nth-of-type(2) .logo { - animation: logo-spin infinite 20s linear; - } -} - -.card { - padding: 2em; -} - -.read-the-docs { - color: #888; -} diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index 638d74f..0000000 --- a/src/App.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import { useEffect, useState } from 'react' -import { LarkMap, PointLayer, PointLayerProps } from "@antv/larkmap" -import './App.css' - -const layerOptions: Omit = { - autoFit: true, - shape: 'circle', - size: { - field: 'temperature', - value: ({ temperature }) => temperature, - }, - color: { - field: 'temperature', - value: ['#0f9960', '#33a02c', '#377eb8'], - }, - state: { - active: true, - }, - style: { - opacity: 0.8, - }, -}; - -function App() { - const [source, setSource] = useState({ - data: [], - parser: { type: 'json', x: 'lng', y: 'lat' }, - }); - - useEffect(() => { - fetch('https://gw.alipayobjects.com/os/antfincdn/Lx96%24Pnwhw/city-weather.json') - .then((response) => response.json()) - .then((data) => { - setSource((prevState) => ({ ...prevState, data })); - }); - }, []); - - return ( - - - - ) -} - -export default App diff --git a/src/components/data-assets/index.module.less b/src/components/data-assets/index.module.less new file mode 100644 index 0000000..c82906b --- /dev/null +++ b/src/components/data-assets/index.module.less @@ -0,0 +1,5 @@ +.container { + width: 100vw; + height: calc(100vh - 64px); + color: #000; +} \ No newline at end of file diff --git a/src/components/data-assets/index.tsx b/src/components/data-assets/index.tsx new file mode 100644 index 0000000..ac29ea0 --- /dev/null +++ b/src/components/data-assets/index.tsx @@ -0,0 +1,8 @@ +import styles from "./index.module.less" + +export const DataAssets = () => { + + return ( +
数据检索
+ ) +} \ No newline at end of file diff --git a/src/components/data-retrieval/data-panel/index.module.less b/src/components/data-retrieval/data-panel/index.module.less new file mode 100644 index 0000000..922dcea --- /dev/null +++ b/src/components/data-retrieval/data-panel/index.module.less @@ -0,0 +1,7 @@ +.dataPanel { + height: calc(100vh - 64px); + width: 380px; + color: #000; + padding: 10px; + border-right: 1px solid #e4e1e1; +} \ No newline at end of file diff --git a/src/components/data-retrieval/data-panel/index.tsx b/src/components/data-retrieval/data-panel/index.tsx new file mode 100644 index 0000000..2435546 --- /dev/null +++ b/src/components/data-retrieval/data-panel/index.tsx @@ -0,0 +1,7 @@ +import styles from "./index.module.less" + +export const DataPanel = () => { + return ( +
DataPanel
+ ) +} \ No newline at end of file diff --git a/src/components/data-retrieval/index.module.less b/src/components/data-retrieval/index.module.less new file mode 100644 index 0000000..bdf94d8 --- /dev/null +++ b/src/components/data-retrieval/index.module.less @@ -0,0 +1,11 @@ +.dataRetrieval { + display: flex; + align-items: center; + background-color: #fff; + + .larkMapContainer { + width: calc(100vw - 380px); + height: calc(100vh - 64px); + color: #000; + } +} \ No newline at end of file diff --git a/src/components/data-retrieval/index.tsx b/src/components/data-retrieval/index.tsx new file mode 100644 index 0000000..928023b --- /dev/null +++ b/src/components/data-retrieval/index.tsx @@ -0,0 +1,27 @@ +import { IMapConfig } from "@antv/l7" +import { LarkMap, ScaleControl, ZoomControl } from "@antv/larkmap" +import styles from './index.module.less' +import { MapLayer } from "./map-layer" +import { DataPanel } from "./data-panel" + +const mapOptions: Partial = { + zoom: 9, + center: [120.3234, 30.1224], + style: "light", + token: 'f0230f884bbd54e2913c890cdf45aa7e', +} + + +export const DataRetrieval = () => { + return ( +
+ + + + + + +
+ + ) +} \ No newline at end of file diff --git a/src/components/data-retrieval/map-layer/constants.ts b/src/components/data-retrieval/map-layer/constants.ts new file mode 100644 index 0000000..a4d9793 --- /dev/null +++ b/src/components/data-retrieval/map-layer/constants.ts @@ -0,0 +1,38 @@ +export const GOOGLE_TILE_MAP_URL = + 'https://gac-geo.googlecnapps.cn/maps/vt?lyrs=s&gl=CN&x={x}&y={y}&z={z}'; + +export const GOOGLE_TILE_MAP_ROUTER_URL = + 'https://gac-geo.googlecnapps.cn/maps/vt?lyrs=h&gl=CN&x={x}&y={y}&z={z}'; + +export const GEO_VIS_EARTH = "https://tiles{1-3}.geovisearth.com/base/v1/img/{z}/{x}/{y}?format=webp&tmsIds=w&token=b2a0cfc132cd60b61391b9dd63c15711eadb9b38a9943e3f98160d5710aef788" + +export enum OfficeLayerEnum { + GoogleSatellite = 'googleSatellite', + VectorMap = 'vectorMap', + GeoVisEarth = 'geoVisEarth' +} + + +export const BASE_LAYER_GROUP = [ + { + type: OfficeLayerEnum.VectorMap, + title: "矢量地图", + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*qdFDSbvIalgAAAAAAAAAAAAADmJ7AQ/original', + layers: [], + }, + { + type: OfficeLayerEnum.GoogleSatellite, + title: "谷歌遥感地图", + image: + 'https://mdn.alipayobjects.com/huamei_k6sfo0/afts/img/A*zi2jSqqZ2-8AAAAAAAAAAAAADjWqAQ/original', + layers: [GOOGLE_TILE_MAP_URL, GOOGLE_TILE_MAP_ROUTER_URL], + }, + { + type: OfficeLayerEnum.GeoVisEarth, + title: "星图地图", + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Gg87TbHRYNcAAAAAAAAAAAAADmJ7AQ/original', + layers: [GEO_VIS_EARTH], + }, +]; \ No newline at end of file diff --git a/src/components/data-retrieval/map-layer/index.module.less b/src/components/data-retrieval/map-layer/index.module.less new file mode 100644 index 0000000..fb04d1f --- /dev/null +++ b/src/components/data-retrieval/map-layer/index.module.less @@ -0,0 +1,70 @@ +.mapTab { + background-color: rgb(255, 255, 255); + border-radius: 4px; + display: flex; + align-items: center; + box-shadow: rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px, rgba(0, 0, 0, 0.05) 0px 9px 28px 8px; + + &:hover .add-map { + display: block; + } + + .add-map { + display: none; + text-align: center; + + &:hover { + display: block; + color: #1677ff; + } + } + + .hideOfficeLayerBtn { + width: 28px; + display: flex; + align-items: center; + justify-content: center; + background: rgb(255, 255, 255); + border-radius: 4px; + cursor: pointer; + font-size: 16px; + z-index: 2; + transition: all 0.1s 0.1s ease-in-out; + + .anticon { + transition: all 0.2s; + } + + color: rgba(0, 0, 0, 0.45); + } + + .amapInfo { + display: flex; + align-items: center; + cursor: pointer; + padding: 10px; + + .amapInfoItem { + width: 142px; + margin-left: 10px; + } + + .itemBorderActive { + border-radius: 4px; + border: solid 2px #1677ff; + } + + .itemBorder { + border: 1px solid #f1f1f1; + } + + .amapInfoItemImage { + width: 142px; + height: 80px; + } + + .amapInfoItemTitle { + color: rgba(0, 0, 0, 0.8); + } + } +} \ No newline at end of file diff --git a/src/components/data-retrieval/map-layer/index.tsx b/src/components/data-retrieval/map-layer/index.tsx new file mode 100644 index 0000000..1d2819f --- /dev/null +++ b/src/components/data-retrieval/map-layer/index.tsx @@ -0,0 +1,89 @@ +import { + CaretRightOutlined, +} from '@ant-design/icons'; +import { CustomControl, RasterLayer } from '@antv/larkmap'; +import classNames from 'classnames'; +import { useMemo, useState } from 'react'; +import { OfficeLayerEnum, BASE_LAYER_GROUP } from './constants'; +import styles from "./index.module.less" + + +export const MapLayer = () => { + const [hideOfficeLayer, setHideOfficeLayer] = useState(false) + const [radioValue, setRadioValue] = useState(OfficeLayerEnum.VectorMap); + const [layerType, setLayerType] = useState([]); + + const onItemClick = (item: { + type: OfficeLayerEnum; + image: string; + title: string; + layers: string[]; + }) => { + setRadioValue(item.type); + setLayerType(item.layers) + }; + + + const rasterLayer = useMemo(() => { + if (layerType.length === 0) return null + return layerType.map((item, index) => { + return ( + + ); + }); + }, [layerType]); + + return ( + <> + +
+
{ + setHideOfficeLayer(!hideOfficeLayer); + }} + style={{ height: !hideOfficeLayer ? 28 : 127 }} + > + +
+ {hideOfficeLayer && ( +
+ {BASE_LAYER_GROUP.map((item) => { + return ( +
onItemClick(item)} + > + +
+ {item.title} +
+
+ ); + })} +
+ )} +
+ + {rasterLayer} + + ); +} + diff --git a/src/components/layout/index.module.less b/src/components/layout/index.module.less new file mode 100644 index 0000000..7e11e38 --- /dev/null +++ b/src/components/layout/index.module.less @@ -0,0 +1,37 @@ +.headerRender { + display: flex; + align-items: center; + height: 100%; + justify-content: space-between; + + .logo { + height: 40px; + width: 40px; + } + + .menu { + height: 40px; + line-height: 40px; + } +} + +.header { + background-color: #fff; + border-bottom: 1px solid #e4e1e1; + + :global { + .ant-menu-horizontal { + border-bottom: none; + } + + .ant-menu-light.ant-menu-horizontal>.ant-menu-item-selected { + background-color: #e8e8e8; + border-radius: 4px; + } + + .ant-menu-light.ant-menu-horizontal>.ant-menu-item-active::after, + .ant-menu-light.ant-menu-horizontal>.ant-menu-item-selected::after { + border-bottom-color: transparent + } + } +} \ No newline at end of file diff --git a/src/components/layout/index.tsx b/src/components/layout/index.tsx new file mode 100644 index 0000000..5842b35 --- /dev/null +++ b/src/components/layout/index.tsx @@ -0,0 +1,56 @@ +import styles from "./index.module.less" +import { Menu, MenuProps } from "antd" +import { MenuInfo } from "rc-menu/lib/interface" +import React, { useState } from "react"; +import { Layout } from 'antd'; +import { useLocation, useNavigate } from "react-router"; + +type HeaderRenderProps = { + container: React.ReactNode +} +const { Header, Content } = Layout; + +export const LandCoverLayout = (props: HeaderRenderProps) => { + const navigate = useNavigate(); + const location = useLocation() + const [selectMenu, setSelectMenu] = useState(location.pathname) + + const items: MenuProps['items'] = [ + { label: "数据检索", key: '/retrieval' }, + { label: "数据资源", key: '/assets' } + ] + + const onClick = (e: MenuInfo) => { + setSelectMenu(e.key) + navigate(e.key) + } + + const HeaderRender = () => { + return ( +
+ + +
+
+ ) + } + + return ( + +
+ +
+ + {props.container} + + + + + ) +} \ No newline at end of file diff --git a/src/main.tsx b/src/main.tsx index 3d7150d..303873b 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,10 +1,20 @@ import React from 'react' import ReactDOM from 'react-dom/client' -import App from './App.tsx' import './index.css' +import { BrowserRouter, Route, Routes, Navigate } from 'react-router-dom'; +import { LandCoverLayout } from './components/layout/index.tsx'; +import { DataRetrieval } from './components/data-retrieval/index.tsx'; +import { DataAssets } from './components/data-assets/index.tsx'; -ReactDOM.createRoot(document.getElementById('root')!).render( +const root = document.getElementById('root') +ReactDOM.createRoot(root!).render( - + + + } /> + } />} /> + } />} /> + + , ) diff --git a/vite.config.ts b/vite.config.ts index 5a33944..8b27558 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -3,5 +3,16 @@ import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [ + react() + ], + css: { + preprocessorOptions: { + less: { + module: true, + javascriptEnabled: true, + math: 'parens-division', + }, + }, + }, }) From df817774ccdc7d80bcada2b875401baf9fc854cd Mon Sep 17 00:00:00 2001 From: yzg1025 Date: Tue, 19 Dec 2023 18:05:10 +0800 Subject: [PATCH 2/4] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E8=B7=AF?= =?UTF-8?q?=E7=94=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 2 +- src/components/layout/index.module.less | 31 +++++++++++++++++++++---- src/components/layout/index.tsx | 15 ++++++++++-- src/index.css | 4 ++++ 4 files changed, 45 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index f966c6e..b813c98 100644 --- a/index.html +++ b/index.html @@ -5,7 +5,7 @@ 遥感产品数据云 diff --git a/src/components/layout/index.module.less b/src/components/layout/index.module.less index 7e11e38..cca8f54 100644 --- a/src/components/layout/index.module.less +++ b/src/components/layout/index.module.less @@ -5,13 +5,35 @@ justify-content: space-between; .logo { - height: 40px; - width: 40px; + display: flex; + align-items: center; + font-size: 18px; + font-weight: bold; + + img { + height: 30px; + width: 30px; + margin-right: 8px; + } + } + + .notice { + display: flex; + align-items: center; + cursor: pointer; + + span { + margin-right: 8px; + } + } + + .notice:hover { + color: #1677ff; } .menu { - height: 40px; - line-height: 40px; + height: 35px; + line-height: 35px; } } @@ -34,4 +56,5 @@ border-bottom-color: transparent } } + } \ No newline at end of file diff --git a/src/components/layout/index.tsx b/src/components/layout/index.tsx index 5842b35..40b4de7 100644 --- a/src/components/layout/index.tsx +++ b/src/components/layout/index.tsx @@ -4,6 +4,7 @@ import { MenuInfo } from "rc-menu/lib/interface" import React, { useState } from "react"; import { Layout } from 'antd'; import { useLocation, useNavigate } from "react-router"; +import { InfoCircleOutlined } from "@ant-design/icons"; type HeaderRenderProps = { container: React.ReactNode @@ -25,10 +26,17 @@ export const LandCoverLayout = (props: HeaderRenderProps) => { navigate(e.key) } + const goNotice = () => { + window.open("https://www.landcover100.com/UserWebPage", "_blank") + } + const HeaderRender = () => { return (
- +
+ + 遥感产品数据云 +
{ mode="horizontal" items={items} /> -
+
+ + 使用须知 +
) } diff --git a/src/index.css b/src/index.css index 6119ad9..8c97c00 100644 --- a/src/index.css +++ b/src/index.css @@ -66,3 +66,7 @@ button:focus-visible { background-color: #f9f9f9; } } + +.ant-layout-header { + padding: 0 32px; +} From c76786b30a898ec4fafeb4df2be6b8be5b800050 Mon Sep 17 00:00:00 2001 From: yzg1025 Date: Fri, 22 Dec 2023 17:47:49 +0800 Subject: [PATCH 3/4] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E5=9B=BE?= =?UTF-8?q?=E5=B1=82=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 556 ++++++++++-------- package.json | 9 +- .../data-panel/index.module.less | 20 + .../data-retrieval/data-panel/index.tsx | 30 +- src/components/data-retrieval/index.tsx | 14 +- .../location-select/constants.ts | 99 ++++ .../data-retrieval/location-select/draw.tsx | 57 ++ .../location-select/index.module.less | 25 + .../data-retrieval/location-select/index.tsx | 141 +++++ .../data-retrieval/map-layer/constants.ts | 2 +- .../map-layer/index.module.less | 8 +- .../data-retrieval/map-layer/index.tsx | 160 ++--- src/components/layout/index.module.less | 4 +- src/index.css | 4 + src/utils.ts | 1 + vite.config.ts | 13 +- 16 files changed, 803 insertions(+), 340 deletions(-) create mode 100644 src/components/data-retrieval/location-select/constants.ts create mode 100644 src/components/data-retrieval/location-select/draw.tsx create mode 100644 src/components/data-retrieval/location-select/index.module.less create mode 100644 src/components/data-retrieval/location-select/index.tsx create mode 100644 src/utils.ts diff --git a/package-lock.json b/package-lock.json index 3278926..02289e8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,14 +8,19 @@ "name": "landcover", "version": "0.0.0", "dependencies": { - "@antv/l7": "^2.20.5", - "@antv/larkmap": "^1.4.10", + "@antv/l7": "^2.11.0", + "@antv/l7-draw": "^3.1.0", + "@antv/larkmap": "^1.4.4", + "@turf/turf": "^6.5.0", + "@types/turf": "^3.5.32", "antd": "^5.12.2", + "lodash": "^4.17.21", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.21.0" }, "devDependencies": { + "@types/lodash": "^4.14.202", "@types/react": "^18.2.43", "@types/react-dom": "^18.2.17", "@typescript-eslint/eslint-plugin": "^6.14.0", @@ -140,9 +145,9 @@ "integrity": "sha512-4ddpsiHN9Pd4UIlWuKVK1C4IiZIdbwQvy9i7DUSI3xNJ89FPUFt8lxDYj8GzzfdllV0NkJTRxnG+FvLk0llidg==" }, "node_modules/@antv/g-device-api": { - "version": "1.4.8", - "resolved": "https://registry.npmjs.org/@antv/g-device-api/-/g-device-api-1.4.8.tgz", - "integrity": "sha512-V92kMQtBo8y7UzKPRaUwEBpU9m32POF55bcNCB6cqbVBCy5wjq/crfxJo3PD1Lmy+mxonUKBGQto7OCnrjIMbA==", + "version": "1.4.10", + "resolved": "https://registry.npmjs.org/@antv/g-device-api/-/g-device-api-1.4.10.tgz", + "integrity": "sha512-csPzj91BPZinnjTvQ1CURkq9auuo0Wl5nD1xGfWZmpUnQQwZzEUQiBvLdU8LtCoS4nkcJ9GNvZ7d06IEYZfHhg==", "dependencies": { "@antv/util": "^3.3.4", "@webgpu/types": "^0.1.34", @@ -151,76 +156,59 @@ "tslib": "^2.5.3" } }, + "node_modules/@antv/g-device-api/node_modules/@antv/util": { + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/@antv/util/-/util-3.3.5.tgz", + "integrity": "sha512-bVv1loamL/MgUEN9dNt7VKAsghO4Wgb+kzr8B9TgkM5tHgKk++xiTwi3pejIdgU8DDkzcyaRsO+VTOXJt8jLng==", + "dependencies": { + "fast-deep-equal": "^3.1.3", + "flru": "^1.0.2", + "gl-matrix": "^3.3.0", + "tslib": "^2.3.1" + } + }, "node_modules/@antv/g-device-api/node_modules/eventemitter3": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz", "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==" }, "node_modules/@antv/l7": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7/-/l7-2.20.5.tgz", - "integrity": "sha512-3r9lQQHhhE8GIFbiDhSZmptq4m0BCfE9kHIH/eTPoatuOowIuZGfZ57utUUU73zYRWLf6SUBS3JP+/mLYSWGjA==", - "dependencies": { - "@antv/l7-component": "2.20.5", - "@antv/l7-core": "2.20.5", - "@antv/l7-layers": "2.20.5", - "@antv/l7-maps": "2.20.5", - "@antv/l7-scene": "2.20.5", - "@antv/l7-source": "2.20.5", - "@antv/l7-utils": "2.20.5", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7/-/l7-2.20.9.tgz", + "integrity": "sha512-4WQaaz0/eZkYc/48gR4h8O3Nq9Le8b4ghdHpiAHdOPK3AvUKr/GyAQcjkLK6g31IVZ0oiWD0sEvzKYk0pJqr/A==", + "dependencies": { + "@antv/l7-component": "2.20.9", + "@antv/l7-core": "2.20.9", + "@antv/l7-layers": "2.20.9", + "@antv/l7-maps": "2.20.9", + "@antv/l7-scene": "2.20.9", + "@antv/l7-source": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "webpack-bundle-analyzer": "^4.9.1" } }, "node_modules/@antv/l7-component": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-component/-/l7-component-2.20.5.tgz", - "integrity": "sha512-dXB8ROK5TrAB+HgjBQnG4oN6AgAcOVR0dTiW2ZnT2R7Xw7U+425rY6bz0ULpaBpUABQZGm+aYHsiGAVdDLQp6w==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-component/-/l7-component-2.20.9.tgz", + "integrity": "sha512-FssjP+F1VZvauRR9wlUBSxcBIYxcwvU1tEqZVIPzcQ/JayCjFaI4ea24u6kvN4qSIkl/RW+4ZnTaR66ztnHqHw==", "dependencies": { - "@antv/l7-core": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "eventemitter3": "^4.0.0", "inversify": "^5.0.1", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "supercluster": "^7.0.0" } }, - "node_modules/@antv/l7-composite-layers": { - "version": "0.16.4", - "resolved": "https://registry.npmjs.org/@antv/l7-composite-layers/-/l7-composite-layers-0.16.4.tgz", - "integrity": "sha512-LgFLPfcNHXmQHUXxRlVGQevSRXCNHXjS7h6rrCcXOKJNNvGOn5bilqKHFHqxoareAXy8WTg+gKKcxUdObNcZUg==", - "dependencies": { - "@antv/event-emitter": "^0.1.2", - "@antv/scale": "^0.4.12", - "@antv/util": "^2.0.14", - "@turf/bbox": "^6.5.0", - "@turf/bbox-polygon": "^6.5.0", - "@turf/transform-scale": "^6.5.0", - "kdbush": "^3.0.0", - "lodash-es": "^4.17.21", - "reselect": "^4.1.8" - }, - "peerDependencies": { - "@antv/l7": "^2.11.5" - } - }, - "node_modules/@antv/l7-composite-layers/node_modules/@antv/util": { - "version": "2.0.17", - "resolved": "https://registry.npmjs.org/@antv/util/-/util-2.0.17.tgz", - "integrity": "sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==", - "dependencies": { - "csstype": "^3.0.8", - "tslib": "^2.0.3" - } - }, "node_modules/@antv/l7-core": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-core/-/l7-core-2.20.5.tgz", - "integrity": "sha512-szeERmOqW+GV6yY0QNd6A8f/s6IFI38WlnXRHOMMdtLu13zt/LRYaNOoZMWW0wAKa/icgTjy/fzqkuC83Sfrjg==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-core/-/l7-core-2.20.9.tgz", + "integrity": "sha512-PtwEvdqyw0asNTBCGNrUVs8TVb9Pbs+9XH47xG2SECSVUktpeIJEhbnnUHBl+hDqnqZK5+DlyZz8RslwOnsrQA==", "dependencies": { "@antv/async-hook": "^2.2.9", - "@antv/l7-utils": "2.20.5", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/tiny-sdf": "^1.2.5", "@turf/helpers": "^6.1.4", @@ -231,7 +219,7 @@ "hammerjs": "^2.0.8", "inversify": "^5.0.1", "inversify-inject-decorators": "^3.1.0", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "viewport-mercator-project": "^6.2.1" } }, @@ -265,15 +253,15 @@ } }, "node_modules/@antv/l7-layers": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-layers/-/l7-layers-2.20.5.tgz", - "integrity": "sha512-kz0fFDOylSK4msWrocVsffpuot5T0XElxvXomcnSLq9jRH5x0GHxKzrIOlQ6iUusaU3w5ZxJ4H6Nhu5DNvzs8g==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-layers/-/l7-layers-2.20.9.tgz", + "integrity": "sha512-3yDE/iu3a/T8AgcsGEey2LnOUyffBEh5S+aoKBF+NLsxRrWwAkOxrlB0Yt4phdniYeD3ZBZsrA67wi1QZY5lfA==", "dependencies": { "@antv/async-hook": "^2.2.9", - "@antv/l7-core": "2.20.5", - "@antv/l7-maps": "2.20.5", - "@antv/l7-source": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-maps": "2.20.9", + "@antv/l7-source": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/martini": "^0.2.0", "@turf/clone": "^6.5.0", @@ -295,12 +283,17 @@ "reflect-metadata": "^0.1.13" } }, + "node_modules/@antv/l7-layers/node_modules/reflect-metadata": { + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", + "integrity": "sha512-ZhYeb6nRaXCfhnndflDK8qI6ZQ/YcWZCISRAWICW9XYqMUwjZM9Z0DveWX/ABN01oxSHwVxKQmxeYZSsm0jh5A==" + }, "node_modules/@antv/l7-map": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-map/-/l7-map-2.20.5.tgz", - "integrity": "sha512-9KoGIadepSBqzmZRbcbrSCtffCmFwUPfGliQqBSYNn/ZWcqyBKCJCyvQqu2P6q/HcWF/deg8G33+Nmnpra93Vg==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-map/-/l7-map-2.20.9.tgz", + "integrity": "sha512-Nnd4TL2U2BsRlsN4TD3LsLKhbEAY6w4tr2MmyRQ5cPPGJo552CmUnLVD0W0XKQaFi5z8ThfMIja4XgcRxfE/0w==", "dependencies": { - "@antv/l7-utils": "2.20.5", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/point-geometry": "^0.1.0", "@mapbox/unitbezier": "^0.0.0", @@ -310,48 +303,48 @@ } }, "node_modules/@antv/l7-maps": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-maps/-/l7-maps-2.20.5.tgz", - "integrity": "sha512-Lv2PtADM2RP+IBFoWm81yrwfZE4Hvuj15rbeSBXISd+9vZdVaxYceFxClvEtDJq4x1bj0+cjQLCtMr4pltDb1g==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-maps/-/l7-maps-2.20.9.tgz", + "integrity": "sha512-kPKALocvUH1OM79MTap/dhnybpnvORVY8kyOZffkTEEPpmo2xhWhaowxj8/mhmgvnCurAiQRR9O9U4eCc4hpXQ==", "dependencies": { "@amap/amap-jsapi-loader": "^1.0.1", - "@antv/l7-core": "2.20.5", - "@antv/l7-map": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-map": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "gl-matrix": "^3.1.0", "inversify": "^5.0.1", "mapbox-gl": "^1.2.1", "maplibre-gl": "^3.5.2", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "viewport-mercator-project": "^6.2.1" } }, "node_modules/@antv/l7-renderer": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-renderer/-/l7-renderer-2.20.5.tgz", - "integrity": "sha512-0WONfggP9zsPVwts6oNSv3gpDdQbx2hDhjrjbI7wRgbCM7Ib4Q7RMbHQ5lgyq43H5GYeduZqehNbV4zcPLiw9A==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-renderer/-/l7-renderer-2.20.9.tgz", + "integrity": "sha512-KXPIfom0xcXquP0mvEWyp9axjugazITVj4MOBCWfBAR/Bh06eTw0m3syNgIY7Etb4aWY9zf24kVvnxAwy4lMhg==", "dependencies": { - "@antv/g-device-api": "^1.3.6", - "@antv/l7-core": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/g-device-api": "^1.4.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "inversify": "^5.0.1", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "regl": "1.6.1" } }, "node_modules/@antv/l7-scene": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-scene/-/l7-scene-2.20.5.tgz", - "integrity": "sha512-lgxgu94rrEfaxDxwDCayTjhPKnEoW2yMzpocXR++oROrryvxq4GKr5JawNe86MxTKJGrpzZTQH/oTrICBSxeHw==", - "dependencies": { - "@antv/l7-component": "2.20.5", - "@antv/l7-core": "2.20.5", - "@antv/l7-layers": "2.20.5", - "@antv/l7-maps": "2.20.5", - "@antv/l7-renderer": "2.20.5", - "@antv/l7-utils": "2.20.5", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-scene/-/l7-scene-2.20.9.tgz", + "integrity": "sha512-n0E6xYY5CrJVczZZG1QNVzHQNVX0fQAg/TO2MkkRl0KhJx19bRYuKwdho10n65xWZ/NNExA64gjCXxKH3/AqeA==", + "dependencies": { + "@antv/l7-component": "2.20.9", + "@antv/l7-core": "2.20.9", + "@antv/l7-layers": "2.20.9", + "@antv/l7-maps": "2.20.9", + "@antv/l7-renderer": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "eventemitter3": "^4.0.7", "inversify": "^5.0.1", @@ -359,14 +352,19 @@ "reflect-metadata": "^0.1.13" } }, + "node_modules/@antv/l7-scene/node_modules/reflect-metadata": { + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", + "integrity": "sha512-ZhYeb6nRaXCfhnndflDK8qI6ZQ/YcWZCISRAWICW9XYqMUwjZM9Z0DveWX/ABN01oxSHwVxKQmxeYZSsm0jh5A==" + }, "node_modules/@antv/l7-source": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-source/-/l7-source-2.20.5.tgz", - "integrity": "sha512-c05NQgq8H5JM8nAcCuD+nFnn1RZV/MMKUdWYuyiRGvmKqpObKVs50jY1NXUCpB3xqhksvnne4QFkm3mDFcKS8Q==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-source/-/l7-source-2.20.9.tgz", + "integrity": "sha512-efNP7fcqsTki9QLwnpbdX6fWfqEzEcW4W2zm1m3McedJg6cPTti1Xclk/DYylOM0pityKDFq7NL0QgqkqZ32jQ==", "dependencies": { "@antv/async-hook": "^2.2.9", - "@antv/l7-core": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/geojson-rewind": "^0.5.2", "@mapbox/vector-tile": "^1.3.1", @@ -379,14 +377,14 @@ "geojson-vt": "^3.2.1", "inversify": "^5.0.1", "pbf": "^3.2.1", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "supercluster": "^7.0.0" } }, "node_modules/@antv/l7-utils": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-utils/-/l7-utils-2.20.5.tgz", - "integrity": "sha512-7gTv8IapVJ9o8N2tyoAOqOEt2YOhK5wubXGLJp2/5z1aMURoo3JlnjA13TFgMkf4lD4ggOMKKjZLlo5Fvxb4fg==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-utils/-/l7-utils-2.20.9.tgz", + "integrity": "sha512-TFLHtAq4Mq+yIuMxfRESyGYE3xxVqw2N/doMbccnp0TnuhCdRd8TL8F9mUZwMdUUFF+eHcOBHNgkoDLPZa3FyA==", "dependencies": { "@babel/runtime": "^7.7.7", "@turf/bbox": "^6.5.0", @@ -401,9 +399,9 @@ } }, "node_modules/@antv/larkmap": { - "version": "1.4.10", - "resolved": "https://registry.npmjs.org/@antv/larkmap/-/larkmap-1.4.10.tgz", - "integrity": "sha512-lvYAAVuAtbfrAs7YAPOd6vc2xABNnAshbagq39DddB0CSAYJEqGZ004/IwLREH8L3/j/rHrp6K5Mw+duwz2/bA==", + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/@antv/larkmap/-/larkmap-1.4.4.tgz", + "integrity": "sha512-UpLdCmX+2qiizWSnHegMHYnYQJ7ZJx5DGb4QVOhoHHMDj5v7jq8xQchZMMmSyIjmin/FLGLxrIuTXuMBlPQaAg==", "dependencies": { "@antv/event-emitter": "^0.1.3", "@antv/l7-composite-layers": "0.x", @@ -420,17 +418,36 @@ "react-dom": ">=16.9.0" } }, + "node_modules/@antv/larkmap/node_modules/@antv/l7-composite-layers": { + "version": "0.16.4", + "resolved": "https://registry.npmjs.org/@antv/l7-composite-layers/-/l7-composite-layers-0.16.4.tgz", + "integrity": "sha512-LgFLPfcNHXmQHUXxRlVGQevSRXCNHXjS7h6rrCcXOKJNNvGOn5bilqKHFHqxoareAXy8WTg+gKKcxUdObNcZUg==", + "dependencies": { + "@antv/event-emitter": "^0.1.2", + "@antv/scale": "^0.4.12", + "@antv/util": "^2.0.14", + "@turf/bbox": "^6.5.0", + "@turf/bbox-polygon": "^6.5.0", + "@turf/transform-scale": "^6.5.0", + "kdbush": "^3.0.0", + "lodash-es": "^4.17.21", + "reselect": "^4.1.8" + }, + "peerDependencies": { + "@antv/l7": "^2.11.5" + } + }, "node_modules/@antv/scale": { - "version": "0.4.14", - "resolved": "https://registry.npmjs.org/@antv/scale/-/scale-0.4.14.tgz", - "integrity": "sha512-7JFQqmPLeBSFVOiBxEYR6I5JexKRFOEBo/y7R9OuTL9uPmMvzVFRk38lKg2tU1iU46f0LwR9w7NAEMcOrgjIZg==", + "version": "0.4.15", + "resolved": "https://registry.npmjs.org/@antv/scale/-/scale-0.4.15.tgz", + "integrity": "sha512-b3b2U1L55fcJg0fB/BloVvcngPo/QxhosWgjn6JmYLVLezxDYMO+zdQou8hxpsLMUVhH15NqRDcM/1n4U6G04g==", "dependencies": { "@antv/util": "^2.0.13", "color-string": "^1.5.5", "fecha": "^4.2.1" } }, - "node_modules/@antv/scale/node_modules/@antv/util": { + "node_modules/@antv/util": { "version": "2.0.17", "resolved": "https://registry.npmjs.org/@antv/util/-/util-2.0.17.tgz", "integrity": "sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==", @@ -439,17 +456,6 @@ "tslib": "^2.0.3" } }, - "node_modules/@antv/util": { - "version": "3.3.5", - "resolved": "https://registry.npmjs.org/@antv/util/-/util-3.3.5.tgz", - "integrity": "sha512-bVv1loamL/MgUEN9dNt7VKAsghO4Wgb+kzr8B9TgkM5tHgKk++xiTwi3pejIdgU8DDkzcyaRsO+VTOXJt8jLng==", - "dependencies": { - "fast-deep-equal": "^3.1.3", - "flru": "^1.0.2", - "gl-matrix": "^3.3.0", - "tslib": "^2.3.1" - } - }, "node_modules/@babel/code-frame": { "version": "7.23.5", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz", @@ -3403,6 +3409,12 @@ "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", "dev": true }, + "node_modules/@types/lodash": { + "version": "4.14.202", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.202.tgz", + "integrity": "sha512-OvlIYQK9tNneDlS0VN54LLd5uiPCBOp7gS5Z0f1mjoJYBrtStzgmJBxONW3U6OZqdtNzZPmn9BS/7WI7BFFcFQ==", + "dev": true + }, "node_modules/@types/mapbox__point-geometry": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/@types/mapbox__point-geometry/-/mapbox__point-geometry-0.1.4.tgz", @@ -3469,6 +3481,15 @@ "@types/geojson": "*" } }, + "node_modules/@types/turf": { + "version": "3.5.32", + "resolved": "https://registry.npmjs.org/@types/turf/-/turf-3.5.32.tgz", + "integrity": "sha512-2Rtv0EIG7Tx1CC2ASzCPw63ugCwrqJCFqNL/Gk9QYE5iIyd+0/S/TlPTgQ+qeQC8NCEn/TncUeZp+aM9cg68rg==", + "deprecated": "'turf' has been deprecated in favor of '@turf/turf', which provides its own types.", + "dependencies": { + "@types/geojson": "*" + } + }, "node_modules/@typescript-eslint/eslint-plugin": { "version": "6.15.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.15.0.tgz", @@ -5818,9 +5839,9 @@ "integrity": "sha512-QNo4kEepaIBwiT8CDhP98umTetp+JNfQYBWvC1pc6/OAibuXtRcxZ58Qz8skvEHYvURne/7R8T5VoOI7rDsEUA==" }, "node_modules/mrmime": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz", - "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==", + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz", + "integrity": "sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==", "engines": { "node": ">=10" } @@ -6865,9 +6886,9 @@ } }, "node_modules/reflect-metadata": { - "version": "0.1.14", - "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", - "integrity": "sha512-ZhYeb6nRaXCfhnndflDK8qI6ZQ/YcWZCISRAWICW9XYqMUwjZM9Z0DveWX/ABN01oxSHwVxKQmxeYZSsm0jh5A==" + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.1.tgz", + "integrity": "sha512-i5lLI6iw9AU3Uu4szRNPPEkomnkjRTaVt9hy/bn5g/oSzekBSMeLZblcjP74AW0vBabqERLLIrz+gR8QYR54Tw==" }, "node_modules/regenerator-runtime": { "version": "0.14.1", @@ -7152,12 +7173,12 @@ } }, "node_modules/sirv": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.3.tgz", - "integrity": "sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==", + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz", + "integrity": "sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==", "dependencies": { - "@polka/url": "^1.0.0-next.20", - "mrmime": "^1.0.0", + "@polka/url": "^1.0.0-next.24", + "mrmime": "^2.0.0", "totalist": "^3.0.0" }, "engines": { @@ -7817,9 +7838,9 @@ "integrity": "sha512-4ddpsiHN9Pd4UIlWuKVK1C4IiZIdbwQvy9i7DUSI3xNJ89FPUFt8lxDYj8GzzfdllV0NkJTRxnG+FvLk0llidg==" }, "@antv/g-device-api": { - "version": "1.4.8", - "resolved": "https://registry.npmjs.org/@antv/g-device-api/-/g-device-api-1.4.8.tgz", - "integrity": "sha512-V92kMQtBo8y7UzKPRaUwEBpU9m32POF55bcNCB6cqbVBCy5wjq/crfxJo3PD1Lmy+mxonUKBGQto7OCnrjIMbA==", + "version": "1.4.10", + "resolved": "https://registry.npmjs.org/@antv/g-device-api/-/g-device-api-1.4.10.tgz", + "integrity": "sha512-csPzj91BPZinnjTvQ1CURkq9auuo0Wl5nD1xGfWZmpUnQQwZzEUQiBvLdU8LtCoS4nkcJ9GNvZ7d06IEYZfHhg==", "requires": { "@antv/util": "^3.3.4", "@webgpu/types": "^0.1.34", @@ -7828,6 +7849,17 @@ "tslib": "^2.5.3" }, "dependencies": { + "@antv/util": { + "version": "3.3.5", + "resolved": "https://registry.npmjs.org/@antv/util/-/util-3.3.5.tgz", + "integrity": "sha512-bVv1loamL/MgUEN9dNt7VKAsghO4Wgb+kzr8B9TgkM5tHgKk++xiTwi3pejIdgU8DDkzcyaRsO+VTOXJt8jLng==", + "requires": { + "fast-deep-equal": "^3.1.3", + "flru": "^1.0.2", + "gl-matrix": "^3.3.0", + "tslib": "^2.3.1" + } + }, "eventemitter3": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz", @@ -7836,69 +7868,42 @@ } }, "@antv/l7": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7/-/l7-2.20.5.tgz", - "integrity": "sha512-3r9lQQHhhE8GIFbiDhSZmptq4m0BCfE9kHIH/eTPoatuOowIuZGfZ57utUUU73zYRWLf6SUBS3JP+/mLYSWGjA==", - "requires": { - "@antv/l7-component": "2.20.5", - "@antv/l7-core": "2.20.5", - "@antv/l7-layers": "2.20.5", - "@antv/l7-maps": "2.20.5", - "@antv/l7-scene": "2.20.5", - "@antv/l7-source": "2.20.5", - "@antv/l7-utils": "2.20.5", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7/-/l7-2.20.9.tgz", + "integrity": "sha512-4WQaaz0/eZkYc/48gR4h8O3Nq9Le8b4ghdHpiAHdOPK3AvUKr/GyAQcjkLK6g31IVZ0oiWD0sEvzKYk0pJqr/A==", + "requires": { + "@antv/l7-component": "2.20.9", + "@antv/l7-core": "2.20.9", + "@antv/l7-layers": "2.20.9", + "@antv/l7-maps": "2.20.9", + "@antv/l7-scene": "2.20.9", + "@antv/l7-source": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "webpack-bundle-analyzer": "^4.9.1" } }, "@antv/l7-component": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-component/-/l7-component-2.20.5.tgz", - "integrity": "sha512-dXB8ROK5TrAB+HgjBQnG4oN6AgAcOVR0dTiW2ZnT2R7Xw7U+425rY6bz0ULpaBpUABQZGm+aYHsiGAVdDLQp6w==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-component/-/l7-component-2.20.9.tgz", + "integrity": "sha512-FssjP+F1VZvauRR9wlUBSxcBIYxcwvU1tEqZVIPzcQ/JayCjFaI4ea24u6kvN4qSIkl/RW+4ZnTaR66ztnHqHw==", "requires": { - "@antv/l7-core": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "eventemitter3": "^4.0.0", "inversify": "^5.0.1", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "supercluster": "^7.0.0" } }, - "@antv/l7-composite-layers": { - "version": "0.16.4", - "resolved": "https://registry.npmjs.org/@antv/l7-composite-layers/-/l7-composite-layers-0.16.4.tgz", - "integrity": "sha512-LgFLPfcNHXmQHUXxRlVGQevSRXCNHXjS7h6rrCcXOKJNNvGOn5bilqKHFHqxoareAXy8WTg+gKKcxUdObNcZUg==", - "requires": { - "@antv/event-emitter": "^0.1.2", - "@antv/scale": "^0.4.12", - "@antv/util": "^2.0.14", - "@turf/bbox": "^6.5.0", - "@turf/bbox-polygon": "^6.5.0", - "@turf/transform-scale": "^6.5.0", - "kdbush": "^3.0.0", - "lodash-es": "^4.17.21", - "reselect": "^4.1.8" - }, - "dependencies": { - "@antv/util": { - "version": "2.0.17", - "resolved": "https://registry.npmjs.org/@antv/util/-/util-2.0.17.tgz", - "integrity": "sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==", - "requires": { - "csstype": "^3.0.8", - "tslib": "^2.0.3" - } - } - } - }, "@antv/l7-core": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-core/-/l7-core-2.20.5.tgz", - "integrity": "sha512-szeERmOqW+GV6yY0QNd6A8f/s6IFI38WlnXRHOMMdtLu13zt/LRYaNOoZMWW0wAKa/icgTjy/fzqkuC83Sfrjg==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-core/-/l7-core-2.20.9.tgz", + "integrity": "sha512-PtwEvdqyw0asNTBCGNrUVs8TVb9Pbs+9XH47xG2SECSVUktpeIJEhbnnUHBl+hDqnqZK5+DlyZz8RslwOnsrQA==", "requires": { "@antv/async-hook": "^2.2.9", - "@antv/l7-utils": "2.20.5", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/tiny-sdf": "^1.2.5", "@turf/helpers": "^6.1.4", @@ -7909,7 +7914,7 @@ "hammerjs": "^2.0.8", "inversify": "^5.0.1", "inversify-inject-decorators": "^3.1.0", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "viewport-mercator-project": "^6.2.1" } }, @@ -7939,15 +7944,15 @@ } }, "@antv/l7-layers": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-layers/-/l7-layers-2.20.5.tgz", - "integrity": "sha512-kz0fFDOylSK4msWrocVsffpuot5T0XElxvXomcnSLq9jRH5x0GHxKzrIOlQ6iUusaU3w5ZxJ4H6Nhu5DNvzs8g==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-layers/-/l7-layers-2.20.9.tgz", + "integrity": "sha512-3yDE/iu3a/T8AgcsGEey2LnOUyffBEh5S+aoKBF+NLsxRrWwAkOxrlB0Yt4phdniYeD3ZBZsrA67wi1QZY5lfA==", "requires": { "@antv/async-hook": "^2.2.9", - "@antv/l7-core": "2.20.5", - "@antv/l7-maps": "2.20.5", - "@antv/l7-source": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-maps": "2.20.9", + "@antv/l7-source": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/martini": "^0.2.0", "@turf/clone": "^6.5.0", @@ -7967,14 +7972,21 @@ "inversify": "^5.0.1", "polyline-miter-util": "^1.0.1", "reflect-metadata": "^0.1.13" + }, + "dependencies": { + "reflect-metadata": { + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", + "integrity": "sha512-ZhYeb6nRaXCfhnndflDK8qI6ZQ/YcWZCISRAWICW9XYqMUwjZM9Z0DveWX/ABN01oxSHwVxKQmxeYZSsm0jh5A==" + } } }, "@antv/l7-map": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-map/-/l7-map-2.20.5.tgz", - "integrity": "sha512-9KoGIadepSBqzmZRbcbrSCtffCmFwUPfGliQqBSYNn/ZWcqyBKCJCyvQqu2P6q/HcWF/deg8G33+Nmnpra93Vg==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-map/-/l7-map-2.20.9.tgz", + "integrity": "sha512-Nnd4TL2U2BsRlsN4TD3LsLKhbEAY6w4tr2MmyRQ5cPPGJo552CmUnLVD0W0XKQaFi5z8ThfMIja4XgcRxfE/0w==", "requires": { - "@antv/l7-utils": "2.20.5", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/point-geometry": "^0.1.0", "@mapbox/unitbezier": "^0.0.0", @@ -7984,63 +7996,70 @@ } }, "@antv/l7-maps": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-maps/-/l7-maps-2.20.5.tgz", - "integrity": "sha512-Lv2PtADM2RP+IBFoWm81yrwfZE4Hvuj15rbeSBXISd+9vZdVaxYceFxClvEtDJq4x1bj0+cjQLCtMr4pltDb1g==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-maps/-/l7-maps-2.20.9.tgz", + "integrity": "sha512-kPKALocvUH1OM79MTap/dhnybpnvORVY8kyOZffkTEEPpmo2xhWhaowxj8/mhmgvnCurAiQRR9O9U4eCc4hpXQ==", "requires": { "@amap/amap-jsapi-loader": "^1.0.1", - "@antv/l7-core": "2.20.5", - "@antv/l7-map": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-map": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "gl-matrix": "^3.1.0", "inversify": "^5.0.1", "mapbox-gl": "^1.2.1", "maplibre-gl": "^3.5.2", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "viewport-mercator-project": "^6.2.1" } }, "@antv/l7-renderer": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-renderer/-/l7-renderer-2.20.5.tgz", - "integrity": "sha512-0WONfggP9zsPVwts6oNSv3gpDdQbx2hDhjrjbI7wRgbCM7Ib4Q7RMbHQ5lgyq43H5GYeduZqehNbV4zcPLiw9A==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-renderer/-/l7-renderer-2.20.9.tgz", + "integrity": "sha512-KXPIfom0xcXquP0mvEWyp9axjugazITVj4MOBCWfBAR/Bh06eTw0m3syNgIY7Etb4aWY9zf24kVvnxAwy4lMhg==", "requires": { - "@antv/g-device-api": "^1.3.6", - "@antv/l7-core": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/g-device-api": "^1.4.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "inversify": "^5.0.1", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "regl": "1.6.1" } }, "@antv/l7-scene": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-scene/-/l7-scene-2.20.5.tgz", - "integrity": "sha512-lgxgu94rrEfaxDxwDCayTjhPKnEoW2yMzpocXR++oROrryvxq4GKr5JawNe86MxTKJGrpzZTQH/oTrICBSxeHw==", - "requires": { - "@antv/l7-component": "2.20.5", - "@antv/l7-core": "2.20.5", - "@antv/l7-layers": "2.20.5", - "@antv/l7-maps": "2.20.5", - "@antv/l7-renderer": "2.20.5", - "@antv/l7-utils": "2.20.5", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-scene/-/l7-scene-2.20.9.tgz", + "integrity": "sha512-n0E6xYY5CrJVczZZG1QNVzHQNVX0fQAg/TO2MkkRl0KhJx19bRYuKwdho10n65xWZ/NNExA64gjCXxKH3/AqeA==", + "requires": { + "@antv/l7-component": "2.20.9", + "@antv/l7-core": "2.20.9", + "@antv/l7-layers": "2.20.9", + "@antv/l7-maps": "2.20.9", + "@antv/l7-renderer": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "eventemitter3": "^4.0.7", "inversify": "^5.0.1", "mapbox-gl": "^1.2.1", "reflect-metadata": "^0.1.13" + }, + "dependencies": { + "reflect-metadata": { + "version": "0.1.14", + "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", + "integrity": "sha512-ZhYeb6nRaXCfhnndflDK8qI6ZQ/YcWZCISRAWICW9XYqMUwjZM9Z0DveWX/ABN01oxSHwVxKQmxeYZSsm0jh5A==" + } } }, "@antv/l7-source": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-source/-/l7-source-2.20.5.tgz", - "integrity": "sha512-c05NQgq8H5JM8nAcCuD+nFnn1RZV/MMKUdWYuyiRGvmKqpObKVs50jY1NXUCpB3xqhksvnne4QFkm3mDFcKS8Q==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-source/-/l7-source-2.20.9.tgz", + "integrity": "sha512-efNP7fcqsTki9QLwnpbdX6fWfqEzEcW4W2zm1m3McedJg6cPTti1Xclk/DYylOM0pityKDFq7NL0QgqkqZ32jQ==", "requires": { "@antv/async-hook": "^2.2.9", - "@antv/l7-core": "2.20.5", - "@antv/l7-utils": "2.20.5", + "@antv/l7-core": "2.20.9", + "@antv/l7-utils": "2.20.9", "@babel/runtime": "^7.7.7", "@mapbox/geojson-rewind": "^0.5.2", "@mapbox/vector-tile": "^1.3.1", @@ -8053,14 +8072,14 @@ "geojson-vt": "^3.2.1", "inversify": "^5.0.1", "pbf": "^3.2.1", - "reflect-metadata": "^0.1.13", + "reflect-metadata": "^0.2.1", "supercluster": "^7.0.0" } }, "@antv/l7-utils": { - "version": "2.20.5", - "resolved": "https://registry.npmjs.org/@antv/l7-utils/-/l7-utils-2.20.5.tgz", - "integrity": "sha512-7gTv8IapVJ9o8N2tyoAOqOEt2YOhK5wubXGLJp2/5z1aMURoo3JlnjA13TFgMkf4lD4ggOMKKjZLlo5Fvxb4fg==", + "version": "2.20.9", + "resolved": "https://registry.npmjs.org/@antv/l7-utils/-/l7-utils-2.20.9.tgz", + "integrity": "sha512-TFLHtAq4Mq+yIuMxfRESyGYE3xxVqw2N/doMbccnp0TnuhCdRd8TL8F9mUZwMdUUFF+eHcOBHNgkoDLPZa3FyA==", "requires": { "@babel/runtime": "^7.7.7", "@turf/bbox": "^6.5.0", @@ -8075,9 +8094,9 @@ } }, "@antv/larkmap": { - "version": "1.4.10", - "resolved": "https://registry.npmjs.org/@antv/larkmap/-/larkmap-1.4.10.tgz", - "integrity": "sha512-lvYAAVuAtbfrAs7YAPOd6vc2xABNnAshbagq39DddB0CSAYJEqGZ004/IwLREH8L3/j/rHrp6K5Mw+duwz2/bA==", + "version": "1.4.4", + "resolved": "https://registry.npmjs.org/@antv/larkmap/-/larkmap-1.4.4.tgz", + "integrity": "sha512-UpLdCmX+2qiizWSnHegMHYnYQJ7ZJx5DGb4QVOhoHHMDj5v7jq8xQchZMMmSyIjmin/FLGLxrIuTXuMBlPQaAg==", "requires": { "@antv/event-emitter": "^0.1.3", "@antv/l7-composite-layers": "0.x", @@ -8087,38 +8106,43 @@ "color": "^4.2.3", "lodash-es": "^4.17.21", "rc-select": "^14.1.13" + }, + "dependencies": { + "@antv/l7-composite-layers": { + "version": "0.16.4", + "resolved": "https://registry.npmjs.org/@antv/l7-composite-layers/-/l7-composite-layers-0.16.4.tgz", + "integrity": "sha512-LgFLPfcNHXmQHUXxRlVGQevSRXCNHXjS7h6rrCcXOKJNNvGOn5bilqKHFHqxoareAXy8WTg+gKKcxUdObNcZUg==", + "requires": { + "@antv/event-emitter": "^0.1.2", + "@antv/scale": "^0.4.12", + "@antv/util": "^2.0.14", + "@turf/bbox": "^6.5.0", + "@turf/bbox-polygon": "^6.5.0", + "@turf/transform-scale": "^6.5.0", + "kdbush": "^3.0.0", + "lodash-es": "^4.17.21", + "reselect": "^4.1.8" + } + } } }, "@antv/scale": { - "version": "0.4.14", - "resolved": "https://registry.npmjs.org/@antv/scale/-/scale-0.4.14.tgz", - "integrity": "sha512-7JFQqmPLeBSFVOiBxEYR6I5JexKRFOEBo/y7R9OuTL9uPmMvzVFRk38lKg2tU1iU46f0LwR9w7NAEMcOrgjIZg==", + "version": "0.4.15", + "resolved": "https://registry.npmjs.org/@antv/scale/-/scale-0.4.15.tgz", + "integrity": "sha512-b3b2U1L55fcJg0fB/BloVvcngPo/QxhosWgjn6JmYLVLezxDYMO+zdQou8hxpsLMUVhH15NqRDcM/1n4U6G04g==", "requires": { "@antv/util": "^2.0.13", "color-string": "^1.5.5", "fecha": "^4.2.1" - }, - "dependencies": { - "@antv/util": { - "version": "2.0.17", - "resolved": "https://registry.npmjs.org/@antv/util/-/util-2.0.17.tgz", - "integrity": "sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==", - "requires": { - "csstype": "^3.0.8", - "tslib": "^2.0.3" - } - } } }, "@antv/util": { - "version": "3.3.5", - "resolved": "https://registry.npmjs.org/@antv/util/-/util-3.3.5.tgz", - "integrity": "sha512-bVv1loamL/MgUEN9dNt7VKAsghO4Wgb+kzr8B9TgkM5tHgKk++xiTwi3pejIdgU8DDkzcyaRsO+VTOXJt8jLng==", + "version": "2.0.17", + "resolved": "https://registry.npmjs.org/@antv/util/-/util-2.0.17.tgz", + "integrity": "sha512-o6I9hi5CIUvLGDhth0RxNSFDRwXeywmt6ExR4+RmVAzIi48ps6HUy+svxOCayvrPBN37uE6TAc2KDofRo0nK9Q==", "requires": { - "fast-deep-equal": "^3.1.3", - "flru": "^1.0.2", - "gl-matrix": "^3.3.0", - "tslib": "^2.3.1" + "csstype": "^3.0.8", + "tslib": "^2.0.3" } }, "@babel/code-frame": { @@ -10259,6 +10283,12 @@ "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", "dev": true }, + "@types/lodash": { + "version": "4.14.202", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.202.tgz", + "integrity": "sha512-OvlIYQK9tNneDlS0VN54LLd5uiPCBOp7gS5Z0f1mjoJYBrtStzgmJBxONW3U6OZqdtNzZPmn9BS/7WI7BFFcFQ==", + "dev": true + }, "@types/mapbox__point-geometry": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/@types/mapbox__point-geometry/-/mapbox__point-geometry-0.1.4.tgz", @@ -10325,6 +10355,14 @@ "@types/geojson": "*" } }, + "@types/turf": { + "version": "3.5.32", + "resolved": "https://registry.npmjs.org/@types/turf/-/turf-3.5.32.tgz", + "integrity": "sha512-2Rtv0EIG7Tx1CC2ASzCPw63ugCwrqJCFqNL/Gk9QYE5iIyd+0/S/TlPTgQ+qeQC8NCEn/TncUeZp+aM9cg68rg==", + "requires": { + "@types/geojson": "*" + } + }, "@typescript-eslint/eslint-plugin": { "version": "6.15.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.15.0.tgz", @@ -12094,9 +12132,9 @@ "integrity": "sha512-QNo4kEepaIBwiT8CDhP98umTetp+JNfQYBWvC1pc6/OAibuXtRcxZ58Qz8skvEHYvURne/7R8T5VoOI7rDsEUA==" }, "mrmime": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz", - "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==" + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz", + "integrity": "sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==" }, "ms": { "version": "2.1.2", @@ -12815,9 +12853,9 @@ } }, "reflect-metadata": { - "version": "0.1.14", - "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.14.tgz", - "integrity": "sha512-ZhYeb6nRaXCfhnndflDK8qI6ZQ/YcWZCISRAWICW9XYqMUwjZM9Z0DveWX/ABN01oxSHwVxKQmxeYZSsm0jh5A==" + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.1.tgz", + "integrity": "sha512-i5lLI6iw9AU3Uu4szRNPPEkomnkjRTaVt9hy/bn5g/oSzekBSMeLZblcjP74AW0vBabqERLLIrz+gR8QYR54Tw==" }, "regenerator-runtime": { "version": "0.14.1", @@ -13034,12 +13072,12 @@ } }, "sirv": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.3.tgz", - "integrity": "sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==", + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz", + "integrity": "sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==", "requires": { - "@polka/url": "^1.0.0-next.20", - "mrmime": "^1.0.0", + "@polka/url": "^1.0.0-next.24", + "mrmime": "^2.0.0", "totalist": "^3.0.0" } }, diff --git a/package.json b/package.json index da16e4e..1687206 100644 --- a/package.json +++ b/package.json @@ -10,14 +10,19 @@ "preview": "vite preview" }, "dependencies": { - "@antv/l7": "^2.20.5", - "@antv/larkmap": "^1.4.10", + "@antv/l7": "^2.11.0", + "@antv/l7-draw": "^3.1.0", + "@antv/larkmap": "^1.4.4", + "@turf/turf": "^6.5.0", + "@types/turf": "^3.5.32", "antd": "^5.12.2", + "lodash": "^4.17.21", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.21.0" }, "devDependencies": { + "@types/lodash": "^4.14.202", "@types/react": "^18.2.43", "@types/react-dom": "^18.2.17", "@typescript-eslint/eslint-plugin": "^6.14.0", diff --git a/src/components/data-retrieval/data-panel/index.module.less b/src/components/data-retrieval/data-panel/index.module.less index 922dcea..11e827f 100644 --- a/src/components/data-retrieval/data-panel/index.module.less +++ b/src/components/data-retrieval/data-panel/index.module.less @@ -4,4 +4,24 @@ color: #000; padding: 10px; border-right: 1px solid #e4e1e1; + overflow-y: scroll; + + :global { + .ant-tree .ant-tree-node-content-wrapper { + display: flex; + align-items: center; + } + + .ant-tree-iconEle { + width: 40px !important; + } + } +} + +.dataPanel { + overflow: auto; +} + +.dataPanel::-webkit-scrollbar { + width: 0.5em; } \ No newline at end of file diff --git a/src/components/data-retrieval/data-panel/index.tsx b/src/components/data-retrieval/data-panel/index.tsx index 2435546..167e67a 100644 --- a/src/components/data-retrieval/data-panel/index.tsx +++ b/src/components/data-retrieval/data-panel/index.tsx @@ -1,7 +1,35 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ +import { Button, Tree } from "antd" import styles from "./index.module.less" +import { DataNode } from "rc-tree/lib/interface"; + + + +const treeData: DataNode[] = []; export const DataPanel = () => { + + const onSelect = (keys: any, info: any) => { + console.log("key", keys, info) + } + return ( -
DataPanel
+
+
+
数据选择:
+ +
+
+
下载数据:
+ +
+
) } \ No newline at end of file diff --git a/src/components/data-retrieval/index.tsx b/src/components/data-retrieval/index.tsx index 928023b..92963f6 100644 --- a/src/components/data-retrieval/index.tsx +++ b/src/components/data-retrieval/index.tsx @@ -1,14 +1,15 @@ import { IMapConfig } from "@antv/l7" -import { LarkMap, ScaleControl, ZoomControl } from "@antv/larkmap" +import { LarkMap, MapThemeControl, ScaleControl, ZoomControl } from "@antv/larkmap" import styles from './index.module.less' import { MapLayer } from "./map-layer" import { DataPanel } from "./data-panel" +import { LocationSelect } from "./location-select" const mapOptions: Partial = { zoom: 9, center: [120.3234, 30.1224], - style: "light", - token: 'f0230f884bbd54e2913c890cdf45aa7e', + style: "normal", + token: '15cd8a57710d40c9b7c0e3cc120f1200', } @@ -16,10 +17,15 @@ export const DataRetrieval = () => { return (
- + + +
diff --git a/src/components/data-retrieval/location-select/constants.ts b/src/components/data-retrieval/location-select/constants.ts new file mode 100644 index 0000000..b206042 --- /dev/null +++ b/src/components/data-retrieval/location-select/constants.ts @@ -0,0 +1,99 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ +import { getSingleColorStyle } from "@antv/l7-draw"; +import { ChoroplethLayerProps, LineLayerProps, PointLayerProps } from "@antv/larkmap"; +import { message } from "antd"; +import { getEnv } from "../../../utils"; + + +export const enum CoordType { + Point = "Point", + LineString = "LineString", + Polygon = "Polygon", + MultiPolygon = "MultiPolygon", + MultiLineString = "MultiLineString" +} + +export const CITY_LIST = "https://mdn.alipayobjects.com/afts/file/A*1t_pTZauqCIAAAAAAAAAAAAADrd2AQ/city.json" + +export const ICON = "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*CHCXT7F_3YkAAAAAAAAAAAAADmJ7AQ/original" + +export const layerOptions: Omit = { + autoFit: true, + fillColor: "#377eb8", + opacity: 0.3, + strokeColor: 'blue', + lineWidth: 1, + state: { + active: { strokeColor: 'green', lineWidth: 1.5, lineOpacity: 0.8 }, + select: { strokeColor: 'red', lineWidth: 1.5, lineOpacity: 0.8 }, + }, + zIndex: 2, + label: { + field: '省', + visible: true, + style: { fill: '#fff', fontSize: 12, stroke: '#000', strokeWidth: 2 }, + }, +}; + +export const pointOptions: Omit = { + autoFit: true, + shape: 'img', + size: 12, + zIndex: 3, +}; + +export const lineOptions: Omit = { + autoFit: true, + shape: 'line' as const, + size: 1.5, + color: "#377eb8", + style: { + opacity: 1, + lineType: 'solid' as const, + }, + zIndex: 4, +}; + + +export const queryRegionData = (code: string) => { + const newCode = code.length === 9 ? `${code}000` : code + return new Promise((resolve, reject) => { + const header = { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ code: newCode }) + } + fetch(getEnv("/getGsonDB"), header) + .then(response => response.json()) + .then(data => { + if (data.status === 'success') { + fetch(getEnv(`${data.filepath}`)).then((res) => res.json()).then((res) => resolve(res)) + } else { + reject() + message.error(data.message) + } + }) + .catch(() => { + message.info("暂无数据") + }); + }) +} + +export const optionSelect = [ + { label: "行政区划", value: "admin" }, + { label: "本地上传", value: "upload" }, + { label: "绘制", value: "draw" } +] + +export const getDrawStyle = (color: string, LayerZIndex: number) => { + const style: any = getSingleColorStyle(color); + Object.keys(style).forEach((key) => { + style[key].options = { + ...style[key].options, + zIndex: LayerZIndex, + }; + }); + return style; +}; \ No newline at end of file diff --git a/src/components/data-retrieval/location-select/draw.tsx b/src/components/data-retrieval/location-select/draw.tsx new file mode 100644 index 0000000..033f343 --- /dev/null +++ b/src/components/data-retrieval/location-select/draw.tsx @@ -0,0 +1,57 @@ +import { useEffect, useRef } from "react"; +import { ControlEvent, DrawControl } from '@antv/l7-draw'; +import { useScene } from "@antv/larkmap"; +import { FeatureCollection } from "geojson"; +import * as turf from "@turf/turf" +import { getDrawStyle } from "./constants"; +import { getEnv } from "../../../utils"; + +export const DrawControlLand = () => { + const scene = useScene() + const drawRef = useRef() + + const parserDrawData = (polygonList: Record) => { + const newList = [] + for (const key in polygonList) { + if (Object.prototype.hasOwnProperty.call(polygonList, key)) { + const list = polygonList[key]; + if (list.length !== 0) { + newList.push(...list) + } + } + } + const featureCollection = turf.featureCollection(newList) + const header = { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(featureCollection) + } + if (newList.length !== 0) { + fetch(getEnv("/savegeojson"), header) + .then((res) => res.json()) + .then((res) => console.log(res)) + } + } + + useEffect(() => { + if (drawRef.current && !scene) return + drawRef.current = new DrawControl(scene, { + commonDrawOptions: { + style: getDrawStyle("yellow", 7), + } + }); + // 将 Control 添加至地图中 + scene.addControl(drawRef.current); + + // 监听绘制数据改变 + drawRef.current.on(ControlEvent.DataChange, parserDrawData) + + return () => { + scene.removeControl(drawRef.current as DrawControl) + drawRef.current = undefined + } + }, [scene, drawRef]) + + + return null +} \ No newline at end of file diff --git a/src/components/data-retrieval/location-select/index.module.less b/src/components/data-retrieval/location-select/index.module.less new file mode 100644 index 0000000..44cfe33 --- /dev/null +++ b/src/components/data-retrieval/location-select/index.module.less @@ -0,0 +1,25 @@ +.region {} + +:global { + .l7-draw-control__btn { + border-right: none; + border-radius: 4px; + + } + + button:focus { + outline: none !important; + } + + .l7-draw-icon { + fill: #333 !important; + } + + .l7-draw-control__btn--active { + border: 1px solid #1677ff; + + .l7-draw-icon { + fill: currentColor !important; + } + } +} \ No newline at end of file diff --git a/src/components/data-retrieval/location-select/index.tsx b/src/components/data-retrieval/location-select/index.tsx new file mode 100644 index 0000000..12c2673 --- /dev/null +++ b/src/components/data-retrieval/location-select/index.tsx @@ -0,0 +1,141 @@ +/* eslint-disable react-hooks/exhaustive-deps */ +/* eslint-disable @typescript-eslint/no-explicit-any */ +import { ChoroplethLayer, CustomControl, LineLayer, PointLayer, useScene } from "@antv/larkmap" +import { Select, Cascader, Upload, message } from "antd" +import { SingleValueType } from "rc-cascader/lib/Cascader" +import { useEffect, useMemo, useState } from "react" +import { CITY_LIST, CoordType, ICON, layerOptions, lineOptions, optionSelect, pointOptions, queryRegionData } from "./constants" +import { InboxOutlined } from "@ant-design/icons" +import * as turf from "@turf/turf" +import { DrawControlLand } from "./draw" +import styles from "./index.module.less" +import { getEnv } from "../../../utils" + +const { Dragger } = Upload; + + +export const LocationSelect = () => { + const scene = useScene() + const [coordType, setCoordType] = useState() + const [select, setSelect] = useState("admin") + const [regionData, setRegionData] = useState() + const [options, setOptions] = useState([]); + + useEffect(() => { + fetch(CITY_LIST) + .then((res) => res.json()) + .then((result) => { + setOptions(result) + }) + }, []) + + const onChange = (value: string) => { + + setSelect(value) + } + + const onCityChange = async (value: SingleValueType) => { + const code = value[value.length - 1] as string + const featureData: any = await queryRegionData(code) + const firstFeature = featureData.features[0] + setCoordType((turf as any).getType(firstFeature)) + setRegionData(featureData) + } + + // 自定义上传逻辑 + const customRequest = async (options: any) => { + const formData = new FormData() + formData.append('file', options.file) + const response = await fetch(getEnv("/uploadvector"), { + method: 'POST', + body: formData + + }); + const result = await response.json(); + if (response.ok) { + fetch(getEnv(`/${result.fileUrl}`)) + .then((res) => res.json()) + .then((res) => { + const firstFeature = res.features[0] + setCoordType((turf as any).getType(firstFeature)) + setRegionData(res) + }) + } else { + message.error('Upload failed:', result.message); + } + } + + + // 区域选择控件 + const CascaderControl = () => { + if (options.length === 0) return null + return ( + + ) + } + + // 上传控件 + const UploadControl = () => { + return ( + +

+ +

+

请上传矢量文件（支持上传shp、geojson和kml格式）

+ + ) + } + + const controlRender = useMemo(() => { + if (select === "admin") return + if (select === "upload") return + // 绘制控件 https://l7draw.antv.vision/ + return + }, [select, options]) + + // 对上传的数据类型进行处理,不同的形状用不同的图层 + const layerRender = useMemo(() => { + if (!regionData && !coordType) return null + + if (coordType === "MultiPolygon" || coordType === "Polygon") { + return + } + if (coordType === "Point") { + scene?.addImage("img", ICON) + return + } + if (coordType === "LineString" || coordType === "MultiLineString") { + return + } + }, [regionData, coordType, scene]) + + return ( +
+ + @@ -136,6 +154,5 @@ export const LocationSelect = () => { {layerRender}
- - ) -} \ No newline at end of file + ); +}; diff --git a/src/components/data-retrieval/map-layer/constants.ts b/src/components/data-retrieval/map-layer/constants.ts index a2fbfea..d8ce97b 100644 --- a/src/components/data-retrieval/map-layer/constants.ts +++ b/src/components/data-retrieval/map-layer/constants.ts @@ -1,38 +1,38 @@ export const GOOGLE_TILE_MAP_URL = - 'https://gac-geo.googlecnapps.cn/maps/vt?lyrs=s&gl=CN&x={x}&y={y}&z={z}'; + "https://gac-geo.googlecnapps.cn/maps/vt?lyrs=s&gl=CN&x={x}&y={y}&z={z}"; export const GOOGLE_TILE_MAP_ROUTER_URL = - 'https://gac-geo.googlecnapps.cn/maps/vt?lyrs=h&gl=CN&x={x}&y={y}&z={z}'; + "https://gac-geo.googlecnapps.cn/maps/vt?lyrs=h&gl=CN&x={x}&y={y}&z={z}"; -export const GEO_VIS_EARTH = "https://tiles{1-3}.geovisearth.com/base/v1/img/{z}/{x}/{y}?format=webp&tmsIds=w&token=b2a0cfc132cd60b61391b9dd63c15711eadb9b38a9943e3f98160d5710aef788" +export const GEO_VIS_EARTH = + "https://tiles{1-3}.geovisearth.com/base/v1/img/{z}/{x}/{y}?format=webp&tmsIds=w&token=b2a0cfc132cd60b61391b9dd63c15711eadb9b38a9943e3f98160d5710aef788"; export enum OfficeLayerEnum { - GoogleSatellite = 'googleSatellite', - VectorMap = 'vectorMap', - GeoVisEarth = 'geoVisEarth' + GoogleSatellite = "googleSatellite", + VectorMap = "vectorMap", + GeoVisEarth = "geoVisEarth", } - export const BASE_LAYER_GROUP = [ { type: OfficeLayerEnum.VectorMap, title: "矢量地图", image: - 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*qdFDSbvIalgAAAAAAAAAAAAADmJ7AQ/original', + "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*qdFDSbvIalgAAAAAAAAAAAAADmJ7AQ/original", layers: undefined, }, { type: OfficeLayerEnum.GoogleSatellite, title: "谷歌遥感地图", image: - 'https://mdn.alipayobjects.com/huamei_k6sfo0/afts/img/A*zi2jSqqZ2-8AAAAAAAAAAAAADjWqAQ/original', + "https://mdn.alipayobjects.com/huamei_k6sfo0/afts/img/A*zi2jSqqZ2-8AAAAAAAAAAAAADjWqAQ/original", layers: [GOOGLE_TILE_MAP_URL, GOOGLE_TILE_MAP_ROUTER_URL], }, { type: OfficeLayerEnum.GeoVisEarth, title: "星图地图", image: - 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Gg87TbHRYNcAAAAAAAAAAAAADmJ7AQ/original', + "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Gg87TbHRYNcAAAAAAAAAAAAADmJ7AQ/original", layers: [GEO_VIS_EARTH], }, -]; \ No newline at end of file +]; diff --git a/src/components/data-retrieval/map-layer/index.module.less b/src/components/data-retrieval/map-layer/index.module.less index 22375d0..f1efc68 100644 --- a/src/components/data-retrieval/map-layer/index.module.less +++ b/src/components/data-retrieval/map-layer/index.module.less @@ -3,7 +3,10 @@ border-radius: 4px; display: flex; align-items: center; - box-shadow: rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px, rgba(0, 0, 0, 0.05) 0px 9px 28px 8px; + box-shadow: + rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, + rgba(0, 0, 0, 0.12) 0px 3px 6px -4px, + rgba(0, 0, 0, 0.05) 0px 9px 28px 8px; &:hover .add-map { display: block; @@ -69,4 +72,4 @@ color: rgba(0, 0, 0, 0.8); } } -} \ No newline at end of file +} diff --git a/src/components/data-retrieval/map-layer/index.tsx b/src/components/data-retrieval/map-layer/index.tsx index 8d50cae..25b7583 100644 --- a/src/components/data-retrieval/map-layer/index.tsx +++ b/src/components/data-retrieval/map-layer/index.tsx @@ -1,21 +1,19 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import { - CaretRightOutlined -} from '@ant-design/icons'; -import { CustomControl, RasterLayer, useScene } from '@antv/larkmap'; -import classNames from 'classnames'; -import { useEffect, useState } from 'react'; -import { BASE_LAYER_GROUP, OfficeLayerEnum } from './constants'; -import styles from './index.module.less'; +import { CaretRightOutlined } from "@ant-design/icons"; +import { CustomControl, RasterLayer, useScene } from "@antv/larkmap"; +import classNames from "classnames"; +import { useEffect, useState } from "react"; +import { BASE_LAYER_GROUP, OfficeLayerEnum } from "./constants"; +import styles from "./index.module.less"; export function MapLayer() { - const scene = useScene() + const scene = useScene(); const [layerType, setLayerType] = useState([]); const [radioValue, setRadioValue] = useState( layerType.length ? layerType[0] : OfficeLayerEnum.VectorMap, ); - const [hideOfficeLayer, setHideOfficeLayer] = useState(false) + const [hideOfficeLayer, setHideOfficeLayer] = useState(false); const onItemClick = (item: { type: string; @@ -34,7 +32,7 @@ export function MapLayer() { const findItem = BASE_LAYER_GROUP.find( (item) => item.type === layerType[0], ); - if (!findItem?.layers) return null + if (!findItem?.layers) return null; return findItem.layers.map((item, index) => { return ( ); @@ -52,20 +50,22 @@ export function MapLayer() { }; useEffect(() => { - const layer = scene.getLayers().filter((item) => item.type === "RasterLayer") + const layer = scene + .getLayers() + .filter((item) => item.type === "RasterLayer"); if (radioValue === "vectorMap") { layer.forEach((item) => { - const [id] = (item as any).rawConfig.id.split("_") + const [id] = (item as any).rawConfig.id.split("_"); if (id === "googleTile") { - const targetLayer = scene.getLayer(item.id) + const targetLayer = scene.getLayer(item.id); if (targetLayer) { - scene.removeLayer(targetLayer) + scene.removeLayer(targetLayer); } } - }) - window.requestAnimationFrame(() => scene?.render()) + }); + window.requestAnimationFrame(() => scene?.render()); } - }, [scene, layerType, radioValue]) + }, [scene, layerType, radioValue]); return ( @@ -78,7 +78,7 @@ export function MapLayer() { >
@@ -93,16 +93,14 @@ export function MapLayer() { item.type === radioValue ? styles.itemBorderActive : styles.itemBorder, - index === BASE_LAYER_GROUP.length - 1 ? 'item-hover' : '', + index === BASE_LAYER_GROUP.length - 1 ? "item-hover" : "", ])} onClick={() => { onItemClick(item as any); }} > -
- {item.title} -
+
{item.title}
); })} diff --git a/src/components/layout/index.module.less b/src/components/layout/index.module.less index f2f59bc..d5a0c52 100644 --- a/src/components/layout/index.module.less +++ b/src/components/layout/index.module.less @@ -46,15 +46,14 @@ border-bottom: none; } - .ant-menu-light.ant-menu-horizontal>.ant-menu-item-selected { + .ant-menu-light.ant-menu-horizontal > .ant-menu-item-selected { background-color: #e8e8e8; border-radius: 4px; } - .ant-menu-light.ant-menu-horizontal>.ant-menu-item-active::after, - .ant-menu-light.ant-menu-horizontal>.ant-menu-item-selected::after { - border-bottom-color: transparent + .ant-menu-light.ant-menu-horizontal > .ant-menu-item-active::after, + .ant-menu-light.ant-menu-horizontal > .ant-menu-item-selected::after { + border-bottom-color: transparent; } } - -} \ No newline at end of file +} diff --git a/src/components/layout/index.tsx b/src/components/layout/index.tsx index 40b4de7..c699d3d 100644 --- a/src/components/layout/index.tsx +++ b/src/components/layout/index.tsx @@ -1,39 +1,39 @@ -import styles from "./index.module.less" -import { Menu, MenuProps } from "antd" -import { MenuInfo } from "rc-menu/lib/interface" +import styles from "./index.module.less"; +import { Menu, MenuProps } from "antd"; +import { MenuInfo } from "rc-menu/lib/interface"; import React, { useState } from "react"; -import { Layout } from 'antd'; +import { Layout } from "antd"; import { useLocation, useNavigate } from "react-router"; import { InfoCircleOutlined } from "@ant-design/icons"; type HeaderRenderProps = { - container: React.ReactNode -} + container: React.ReactNode; +}; const { Header, Content } = Layout; export const LandCoverLayout = (props: HeaderRenderProps) => { const navigate = useNavigate(); - const location = useLocation() - const [selectMenu, setSelectMenu] = useState(location.pathname) + const location = useLocation(); + const [selectMenu, setSelectMenu] = useState(location.pathname); - const items: MenuProps['items'] = [ - { label: "数据检索", key: '/retrieval' }, - { label: "数据资源", key: '/assets' } - ] + const items: MenuProps["items"] = [ + { label: "数据检索", key: "/retrieval" }, + { label: "数据资源", key: "/assets" }, + ]; const onClick = (e: MenuInfo) => { - setSelectMenu(e.key) - navigate(e.key) - } + setSelectMenu(e.key); + navigate(e.key); + }; const goNotice = () => { - window.open("https://www.landcover100.com/UserWebPage", "_blank") - } + window.open("https://www.landcover100.com/UserWebPage", "_blank"); + }; const HeaderRender = () => { return (
-
+
遥感产品数据云
@@ -49,19 +49,15 @@ export const LandCoverLayout = (props: HeaderRenderProps) => { 使用须知
- ) - } + ); + }; return (
- - {props.container} - + {props.container} - - - ) -} \ No newline at end of file + ); +}; diff --git a/src/main.tsx b/src/main.tsx index 303873b..0b68fb4 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,20 +1,26 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import './index.css' -import { BrowserRouter, Route, Routes, Navigate } from 'react-router-dom'; -import { LandCoverLayout } from './components/layout/index.tsx'; -import { DataRetrieval } from './components/data-retrieval/index.tsx'; -import { DataAssets } from './components/data-assets/index.tsx'; +import React from "react"; +import ReactDOM from "react-dom/client"; +import "./index.css"; +import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom"; +import { LandCoverLayout } from "./components/layout/index.tsx"; +import { DataRetrieval } from "./components/data-retrieval/index.tsx"; +import { DataAssets } from "./components/data-assets/index.tsx"; -const root = document.getElementById('root') +const root = document.getElementById("root"); ReactDOM.createRoot(root!).render( } /> - } />} /> - } />} /> + } />} + /> + } />} + /> , -) +); diff --git a/src/utils.ts b/src/utils.ts index 32c5b74..c70e515 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1 +1,2 @@ -export const getEnv = (url: string) => process.env.NODE_ENV !== 'development' ? `/api${url}` : url; \ No newline at end of file +export const getEnv = (url: string) => + process.env.NODE_ENV !== "development" ? `/api${url}` : url; diff --git a/vite.config.ts b/vite.config.ts index 2099bc9..6eecd2a 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,17 +1,15 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' +import { defineConfig } from "vite"; +import react from "@vitejs/plugin-react"; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [ - react() - ], + plugins: [react()], css: { preprocessorOptions: { less: { module: true, javascriptEnabled: true, - math: 'parens-division', + math: "parens-division", }, }, }, @@ -19,11 +17,11 @@ export default defineConfig({ port: 8000, cors: true, proxy: { - '/api': { - target: 'https://www.landcover100.com/', + "/api": { + target: "https://www.landcover100.com/", changeOrigin: true, - rewrite: (path) => path.replace(/^\/api/, '') - } - } - } -}) \ No newline at end of file + rewrite: (path) => path.replace(/^\/api/, ""), + }, + }, + }, +});