diff --git a/.eslintrc.js b/.eslintrc.js index 8bd6ab1..a698b6e 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -15,6 +15,7 @@ module.exports = { extends: ['eslint:recommended', 'plugin:react/recommended', 'prettier'], plugins: ['@babel', 'prettier'], rules: { - 'prettier/prettier': 'error', + 'no-unused-vars': 'warn', + 'prettier/prettier': 'warn', }, } diff --git a/package-lock.json b/package-lock.json index d830408..0f4d9c6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,9 +9,12 @@ "version": "1.0.0", "license": "ISC", "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "axios": "^0.24.0", "core-js": "^3.20.2", "moment": "^2.29.1", + "ol": "^6.13.0", + "proj4": "^2.7.5", "react": "^17.0.2", "react-dom": "^17.0.2", "react-redux": "^7.2.6", @@ -44,6 +47,7 @@ "less": "^4.1.2", "less-loader": "^10.2.0", "lint-staged": "^12.1.7", + "mini-css-extract-plugin": "^2.6.0", "postcss": "^8.4.5", "postcss-flexbugs-fixes": "^5.0.2", "postcss-loader": "^6.2.1", @@ -63,6 +67,11 @@ "webpack-merge": "^5.8.0" } }, + "node_modules/@amap/amap-jsapi-loader": { + "version": "1.0.1", + "resolved": "https://registry.npmmirror.com/@amap/amap-jsapi-loader/-/amap-jsapi-loader-1.0.1.tgz", + "integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw==" + }, "node_modules/@babel/code-frame": { "version": "7.16.7", "resolved": "https://registry.npmmirror.com/@babel/code-frame/download/@babel/code-frame-7.16.7.tgz", @@ -2119,6 +2128,45 @@ "dev": true, "license": "BSD-3-Clause" }, + "node_modules/@mapbox/jsonlint-lines-primitives": { + "version": "2.0.2", + "resolved": "https://registry.npmmirror.com/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz", + "integrity": "sha512-rY0o9A5ECsTQRVhv7tL/OyDpGAoUB4tTvLiW1DSzQGq4bvTPhNw1VpSNjDJc5GFZ2XuyOtSWSVN05qOtcD71qQ==", + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/@mapbox/mapbox-gl-style-spec": { + "version": "13.23.1", + "resolved": "https://registry.npmmirror.com/@mapbox/mapbox-gl-style-spec/-/mapbox-gl-style-spec-13.23.1.tgz", + "integrity": "sha512-C6wh8A/5EdsgzhL6y6yl464VCQNIxK0yjrpnvCvchcFe3sNK2RbBw/J9u3m+p8Y6S6MsGuSMt3AkGAXOKMYweQ==", + "dependencies": { + "@mapbox/jsonlint-lines-primitives": "~2.0.2", + "@mapbox/point-geometry": "^0.1.0", + "@mapbox/unitbezier": "^0.0.0", + "csscolorparser": "~1.0.2", + "json-stringify-pretty-compact": "^2.0.0", + "minimist": "^1.2.5", + "rw": "^1.3.3", + "sort-object": "^0.3.2" + }, + "bin": { + "gl-style-composite": "bin/gl-style-composite", + "gl-style-format": "bin/gl-style-format", + "gl-style-migrate": "bin/gl-style-migrate", + "gl-style-validate": "bin/gl-style-validate" + } + }, + "node_modules/@mapbox/point-geometry": { + "version": "0.1.0", + "resolved": "https://registry.npmmirror.com/@mapbox/point-geometry/-/point-geometry-0.1.0.tgz", + "integrity": "sha512-6j56HdLTwWGO0fJPlrZtdU/B13q8Uwmo18Ck2GnGgN9PCFyKTZ3UbXeEdRFh18i9XQ92eH2VdtpJHpBD3aripQ==" + }, + "node_modules/@mapbox/unitbezier": { + "version": "0.0.0", + "resolved": "https://registry.npmmirror.com/@mapbox/unitbezier/-/unitbezier-0.0.0.tgz", + "integrity": "sha512-HPnRdYO0WjFjRTSwO3frz1wKaU649OBFPX3Zo/2WZvuRi6zMiRGui8SnPQiQABgqCf8YikDe5t3HViTVw1WUzA==" + }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -2154,6 +2202,11 @@ "node": ">= 8" } }, + "node_modules/@petamoriken/float16": { + "version": "3.6.2", + "resolved": "https://registry.npmmirror.com/@petamoriken/float16/-/float16-3.6.2.tgz", + "integrity": "sha512-zZnksXtFBqvONcXWuAtSWrl3YXaDbU2ArRCCuzM42mP0GBJclD6e0GC3zEemmrjiMSOHcLPyRC4vOnAsnomJIw==" + }, "node_modules/@svgr/babel-plugin-add-jsx-attribute": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-6.0.0.tgz", @@ -4150,6 +4203,11 @@ "url": "https://github.com/sponsors/fb55" } }, + "node_modules/csscolorparser": { + "version": "1.0.3", + "resolved": "https://registry.npmmirror.com/csscolorparser/-/csscolorparser-1.0.3.tgz", + "integrity": "sha512-umPSgYwZkdFoUrH5hIq5kf0wPSXiro51nPw0j2K/c83KflkPSTBGMz6NJvMB+07VlL0y7VPo6QJcDjcgKTTm3w==" + }, "node_modules/cssdb": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/cssdb/-/cssdb-5.0.0.tgz", @@ -5773,6 +5831,24 @@ "node": ">=6.9.0" } }, + "node_modules/geotiff": { + "version": "2.0.4", + "resolved": "https://registry.npmmirror.com/geotiff/-/geotiff-2.0.4.tgz", + "integrity": "sha512-aG8h9bJccGusioPsEWsEqx8qdXpZN71A20WCvRKGxcnHSOWLKmC5ZmsAmodfxb9TRQvs+89KikGuPzxchhA+Uw==", + "dependencies": { + "@petamoriken/float16": "^3.4.7", + "lerc": "^3.0.0", + "lru-cache": "^6.0.0", + "pako": "^2.0.4", + "parse-headers": "^2.0.2", + "web-worker": "^1.2.0", + "xml-utils": "^1.0.2" + }, + "engines": { + "browsers": "defaults", + "node": ">=10.19" + } + }, "node_modules/get-intrinsic": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.1.tgz", @@ -6251,6 +6327,11 @@ "postcss": "^8.1.0" } }, + "node_modules/ieee754": { + "version": "1.2.1", + "resolved": "https://registry.npmmirror.com/ieee754/-/ieee754-1.2.1.tgz", + "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==" + }, "node_modules/ignore": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz", @@ -6799,6 +6880,11 @@ "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=", "dev": true }, + "node_modules/json-stringify-pretty-compact": { + "version": "2.0.0", + "resolved": "https://registry.npmmirror.com/json-stringify-pretty-compact/-/json-stringify-pretty-compact-2.0.0.tgz", + "integrity": "sha512-WRitRfs6BGq4q8gTgOy4ek7iPFXjbra0H3PmDLKm2xnZ+Gh1HUhiKGgCZkSPNULlP7mvfu6FV/mOLhCarspADQ==" + }, "node_modules/json5": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz", @@ -6866,6 +6952,11 @@ "node": ">= 8" } }, + "node_modules/lerc": { + "version": "3.0.0", + "resolved": "https://registry.npmmirror.com/lerc/-/lerc-3.0.0.tgz", + "integrity": "sha512-Rm4J/WaHhRa93nCN2mwWDZFoRVF18G1f47C+kvQWyHGEZxFpTUi73p7lMVSAndyxGt6lJ2/CFbOcf9ra5p8aww==" + }, "node_modules/less": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/less/-/less-4.1.2.tgz", @@ -7393,7 +7484,6 @@ "version": "6.0.0", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", - "dev": true, "dependencies": { "yallist": "^4.0.0" }, @@ -7416,6 +7506,11 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/mapbox-to-css-font": { + "version": "2.4.1", + "resolved": "https://registry.npmmirror.com/mapbox-to-css-font/-/mapbox-to-css-font-2.4.1.tgz", + "integrity": "sha512-QQ/iKiM43DM9+aujTL45Iz5o7gDeSFmy4LPl3HZmNcwCE++NxGazf+yFpY+wCb+YS23sDa1ghpo3zrNFOcHlow==" + }, "node_modules/mdn-data": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz", @@ -7473,6 +7568,11 @@ "node": ">= 0.6" } }, + "node_modules/mgrs": { + "version": "1.0.0", + "resolved": "https://registry.npmmirror.com/mgrs/-/mgrs-1.0.0.tgz", + "integrity": "sha512-awNbTOqCxK1DBGjalK3xqWIstBZgN6fxsMSiXLs9/spqWkF2pAhb2rrYCFSsr1/tT7PhcDGjZndG8SWYn0byYA==" + }, "node_modules/micromatch": { "version": "4.0.4", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.4.tgz", @@ -7528,6 +7628,66 @@ "node": ">=6" } }, + "node_modules/mini-css-extract-plugin": { + "version": "2.6.0", + "resolved": "https://registry.npmmirror.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.6.0.tgz", + "integrity": "sha512-ndG8nxCEnAemsg4FSgS+yNyHKgkTB4nPKqCOgh65j3/30qqC5RaSQQXMm++Y6sb6E1zRSxPkztj9fqxhS1Eo6w==", + "dev": true, + "dependencies": { + "schema-utils": "^4.0.0" + }, + "engines": { + "node": ">= 12.13.0" + }, + "peerDependencies": { + "webpack": "^5.0.0" + } + }, + "node_modules/mini-css-extract-plugin/node_modules/ajv": { + "version": "8.10.0", + "resolved": "https://registry.npmmirror.com/ajv/-/ajv-8.10.0.tgz", + "integrity": "sha512-bzqAEZOjkrUMl2afH8dknrq5KEk2SrwdBROR+vH1EKVQTqaUbJVPdc/gEdggTMM0Se+s+Ja4ju4TlNcStKl2Hw==", + "dev": true, + "dependencies": { + "fast-deep-equal": "^3.1.1", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2", + "uri-js": "^4.2.2" + } + }, + "node_modules/mini-css-extract-plugin/node_modules/ajv-keywords": { + "version": "5.1.0", + "resolved": "https://registry.npmmirror.com/ajv-keywords/-/ajv-keywords-5.1.0.tgz", + "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==", + "dev": true, + "dependencies": { + "fast-deep-equal": "^3.1.3" + }, + "peerDependencies": { + "ajv": "^8.8.2" + } + }, + "node_modules/mini-css-extract-plugin/node_modules/json-schema-traverse": { + "version": "1.0.0", + "resolved": "https://registry.npmmirror.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz", + "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==", + "dev": true + }, + "node_modules/mini-css-extract-plugin/node_modules/schema-utils": { + "version": "4.0.0", + "resolved": "https://registry.npmmirror.com/schema-utils/-/schema-utils-4.0.0.tgz", + "integrity": "sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==", + "dev": true, + "dependencies": { + "@types/json-schema": "^7.0.9", + "ajv": "^8.8.0", + "ajv-formats": "^2.1.1", + "ajv-keywords": "^5.0.0" + }, + "engines": { + "node": ">= 12.13.0" + } + }, "node_modules/minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", @@ -7549,8 +7709,7 @@ "node_modules/minimist": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz", - "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==", - "dev": true + "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==" }, "node_modules/mkdirp": { "version": "0.5.5", @@ -7872,6 +8031,27 @@ "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==", "dev": true }, + "node_modules/ol": { + "version": "6.13.0", + "resolved": "https://registry.npmmirror.com/ol/-/ol-6.13.0.tgz", + "integrity": "sha512-Fa6yt+FArWE9fwYRRhi/8+ULcFDRS2ZuDcLp3R9bQeDVa5T4E4TT9iqLeJhmHG+bzWiLWJHIeFUqw8GD2gW0YA==", + "dependencies": { + "geotiff": "^2.0.2", + "ol-mapbox-style": "^7.0.0", + "pbf": "3.2.1", + "rbush": "^3.0.1" + } + }, + "node_modules/ol-mapbox-style": { + "version": "7.0.0", + "resolved": "https://registry.npmmirror.com/ol-mapbox-style/-/ol-mapbox-style-7.0.0.tgz", + "integrity": "sha512-y0OrKfx/TBcbGUf0UefDuYPSfMCCjPz0aUttm/kG461CNwzJpGavvf/lJ7nyNfeHSJFr0iEEdAbB98UUUQQkww==", + "dependencies": { + "@mapbox/mapbox-gl-style-spec": "^13.20.1", + "mapbox-to-css-font": "^2.4.1", + "webfont-matcher": "^1.1.0" + } + }, "node_modules/on-finished": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz", @@ -8015,6 +8195,11 @@ "node": ">=6" } }, + "node_modules/pako": { + "version": "2.0.4", + "resolved": "https://registry.npmmirror.com/pako/-/pako-2.0.4.tgz", + "integrity": "sha512-v8tweI900AUkZN6heMU/4Uy4cXRc2AYNRggVmTR+dEncawDJgCdLMximOVA2p4qO57WMynangsfGRb5WD6L1Bg==" + }, "node_modules/param-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", @@ -8037,6 +8222,11 @@ "node": ">=6" } }, + "node_modules/parse-headers": { + "version": "2.0.4", + "resolved": "https://registry.npmmirror.com/parse-headers/-/parse-headers-2.0.4.tgz", + "integrity": "sha512-psZ9iZoCNFLrgRjZ1d8mn0h9WRqJwFxM9q3x7iUjN/YT2OksthDJ5TiPCu2F38kS4zutqfW+YdVVkBZZx3/1aw==" + }, "node_modules/parse-json": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz", @@ -8131,6 +8321,18 @@ "node": ">=8" } }, + "node_modules/pbf": { + "version": "3.2.1", + "resolved": "https://registry.npmmirror.com/pbf/-/pbf-3.2.1.tgz", + "integrity": "sha512-ClrV7pNOn7rtmoQVF4TS1vyU0WhYRnP92fzbfF75jAIwpnzdJXf8iTd4CMEqO4yUenH6NDqLiwjqlh6QgZzgLQ==", + "dependencies": { + "ieee754": "^1.1.12", + "resolve-protobuf-schema": "^2.1.0" + }, + "bin": { + "pbf": "bin/pbf" + } + }, "node_modules/picocolors": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", @@ -9347,6 +9549,15 @@ "node": ">=0.4.0" } }, + "node_modules/proj4": { + "version": "2.7.5", + "resolved": "https://registry.npmmirror.com/proj4/-/proj4-2.7.5.tgz", + "integrity": "sha512-5ecXUXbHAfvdhfBQpU7EhUfPCQGUCPmVup/4gnZA3bJY3JcK/xxzm4QQDz1xiXokN6ux65VDczlCtBtKrTSpAQ==", + "dependencies": { + "mgrs": "1.0.0", + "wkt-parser": "^1.3.1" + } + }, "node_modules/prompts": { "version": "2.4.2", "resolved": "https://registry.npmjs.org/prompts/-/prompts-2.4.2.tgz", @@ -9370,6 +9581,11 @@ "react-is": "^16.13.1" } }, + "node_modules/protocol-buffers-schema": { + "version": "3.6.0", + "resolved": "https://registry.npmmirror.com/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz", + "integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw==" + }, "node_modules/proxy-addr": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz", @@ -9440,6 +9656,11 @@ } ] }, + "node_modules/quickselect": { + "version": "2.0.0", + "resolved": "https://registry.npmmirror.com/quickselect/-/quickselect-2.0.0.tgz", + "integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw==" + }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -9482,6 +9703,14 @@ "node": ">= 0.8" } }, + "node_modules/rbush": { + "version": "3.0.1", + "resolved": "https://registry.npmmirror.com/rbush/-/rbush-3.0.1.tgz", + "integrity": "sha512-XRaVO0YecOpEuIvbhbpTrZgoiI6xBlz6hnlr6EHhd+0x9ase6EmeN+hdwwUaJvLcsFFQ8iWVF1GAK1yB0BWi0w==", + "dependencies": { + "quickselect": "^2.0.0" + } + }, "node_modules/react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", @@ -10044,6 +10273,14 @@ "node": ">=8" } }, + "node_modules/resolve-protobuf-schema": { + "version": "2.1.0", + "resolved": "https://registry.npmmirror.com/resolve-protobuf-schema/-/resolve-protobuf-schema-2.1.0.tgz", + "integrity": "sha512-kI5ffTiZWmJaS/huM8wZfEMer1eRd7oJQhDuxeCLe3t7N7mX3z94CN0xPxBQxFYQTSNz9T0i+v6inKqSdK8xrQ==", + "dependencies": { + "protocol-buffers-schema": "^3.3.1" + } + }, "node_modules/resolve-url-loader": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-4.0.0.tgz", @@ -10186,6 +10423,11 @@ "queue-microtask": "^1.2.2" } }, + "node_modules/rw": { + "version": "1.3.3", + "resolved": "https://registry.npmmirror.com/rw/-/rw-1.3.3.tgz", + "integrity": "sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==" + }, "node_modules/rxjs": { "version": "7.5.1", "resolved": "https://registry.npmmirror.com/rxjs/download/rxjs-7.5.1.tgz", @@ -10494,6 +10736,34 @@ "websocket-driver": "^0.7.4" } }, + "node_modules/sort-asc": { + "version": "0.1.0", + "resolved": "https://registry.npmmirror.com/sort-asc/-/sort-asc-0.1.0.tgz", + "integrity": "sha512-jBgdDd+rQ+HkZF2/OHCmace5dvpos/aWQpcxuyRs9QUbPRnkEJmYVo81PIGpjIdpOcsnJ4rGjStfDHsbn+UVyw==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/sort-desc": { + "version": "0.1.1", + "resolved": "https://registry.npmmirror.com/sort-desc/-/sort-desc-0.1.1.tgz", + "integrity": "sha512-jfZacW5SKOP97BF5rX5kQfJmRVZP5/adDUTY8fCSPvNcXDVpUEe2pr/iKGlcyZzchRJZrswnp68fgk3qBXgkJw==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/sort-object": { + "version": "0.3.2", + "resolved": "https://registry.npmmirror.com/sort-object/-/sort-object-0.3.2.tgz", + "integrity": "sha512-aAQiEdqFTTdsvUFxXm3umdo04J7MRljoVGbBlkH7BgNsMvVNAJyGj7C/wV1A8wHWAJj/YikeZbfuCKqhggNWGA==", + "dependencies": { + "sort-asc": "^0.1.0", + "sort-desc": "^0.1.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/source-list-map": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz", @@ -11180,6 +11450,16 @@ "minimalistic-assert": "^1.0.0" } }, + "node_modules/web-worker": { + "version": "1.2.0", + "resolved": "https://registry.npmmirror.com/web-worker/-/web-worker-1.2.0.tgz", + "integrity": "sha512-PgF341avzqyx60neE9DD+XS26MMNMoUQRz9NOZwW32nPQrF6p77f1htcnjBSEV8BGMKZ16choqUG4hyI0Hx7mA==" + }, + "node_modules/webfont-matcher": { + "version": "1.1.0", + "resolved": "https://registry.npmmirror.com/webfont-matcher/-/webfont-matcher-1.1.0.tgz", + "integrity": "sha512-ov8lMvF9wi4PD7fK2Axn9PQEpO9cYI0fIoGqErwd+wi8xacFFDmX114D5Q2Lw0Wlgmb+Qw/dKI2KTtimrJf85g==" + }, "node_modules/webpack": { "version": "5.65.0", "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.65.0.tgz", @@ -11567,6 +11847,11 @@ "integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==", "dev": true }, + "node_modules/wkt-parser": { + "version": "1.3.2", + "resolved": "https://registry.npmmirror.com/wkt-parser/-/wkt-parser-1.3.2.tgz", + "integrity": "sha512-A26BOOo7sHAagyxG7iuRhnKMO7Q3mEOiOT4oGUmohtN/Li5wameeU4S6f8vWw6NADTVKljBs8bzA8JPQgSEMVQ==" + }, "node_modules/word-wrap": { "version": "1.2.3", "resolved": "https://registry.npmmirror.com/word-wrap/download/word-wrap-1.2.3.tgz", @@ -11697,11 +11982,15 @@ } } }, + "node_modules/xml-utils": { + "version": "1.0.2", + "resolved": "https://registry.npmmirror.com/xml-utils/-/xml-utils-1.0.2.tgz", + "integrity": "sha512-rEn0FvKi+YGjv9omf22oAf+0d6Ly/sgJ/CUufU/nOzS7SRLmgwSujrewc03KojXxt+aPaTRpm593TgehtUBMSQ==" + }, "node_modules/yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", - "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", - "dev": true + "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==" }, "node_modules/yaml": { "version": "1.10.2", @@ -11726,6 +12015,11 @@ } }, "dependencies": { + "@amap/amap-jsapi-loader": { + "version": "1.0.1", + "resolved": "https://registry.npmmirror.com/@amap/amap-jsapi-loader/-/amap-jsapi-loader-1.0.1.tgz", + "integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw==" + }, "@babel/code-frame": { "version": "7.16.7", "resolved": "https://registry.npmmirror.com/@babel/code-frame/download/@babel/code-frame-7.16.7.tgz", @@ -13151,6 +13445,36 @@ "integrity": "sha1-tSBSnsIdjllFoYUd/Rwy6U45/0U=", "dev": true }, + "@mapbox/jsonlint-lines-primitives": { + "version": "2.0.2", + "resolved": "https://registry.npmmirror.com/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz", + "integrity": "sha512-rY0o9A5ECsTQRVhv7tL/OyDpGAoUB4tTvLiW1DSzQGq4bvTPhNw1VpSNjDJc5GFZ2XuyOtSWSVN05qOtcD71qQ==" + }, + "@mapbox/mapbox-gl-style-spec": { + "version": "13.23.1", + "resolved": "https://registry.npmmirror.com/@mapbox/mapbox-gl-style-spec/-/mapbox-gl-style-spec-13.23.1.tgz", + "integrity": "sha512-C6wh8A/5EdsgzhL6y6yl464VCQNIxK0yjrpnvCvchcFe3sNK2RbBw/J9u3m+p8Y6S6MsGuSMt3AkGAXOKMYweQ==", + "requires": { + "@mapbox/jsonlint-lines-primitives": "~2.0.2", + "@mapbox/point-geometry": "^0.1.0", + "@mapbox/unitbezier": "^0.0.0", + "csscolorparser": "~1.0.2", + "json-stringify-pretty-compact": "^2.0.0", + "minimist": "^1.2.5", + "rw": "^1.3.3", + "sort-object": "^0.3.2" + } + }, + "@mapbox/point-geometry": { + "version": "0.1.0", + "resolved": "https://registry.npmmirror.com/@mapbox/point-geometry/-/point-geometry-0.1.0.tgz", + "integrity": "sha512-6j56HdLTwWGO0fJPlrZtdU/B13q8Uwmo18Ck2GnGgN9PCFyKTZ3UbXeEdRFh18i9XQ92eH2VdtpJHpBD3aripQ==" + }, + "@mapbox/unitbezier": { + "version": "0.0.0", + "resolved": "https://registry.npmmirror.com/@mapbox/unitbezier/-/unitbezier-0.0.0.tgz", + "integrity": "sha512-HPnRdYO0WjFjRTSwO3frz1wKaU649OBFPX3Zo/2WZvuRi6zMiRGui8SnPQiQABgqCf8YikDe5t3HViTVw1WUzA==" + }, "@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -13177,6 +13501,11 @@ "fastq": "^1.6.0" } }, + "@petamoriken/float16": { + "version": "3.6.2", + "resolved": "https://registry.npmmirror.com/@petamoriken/float16/-/float16-3.6.2.tgz", + "integrity": "sha512-zZnksXtFBqvONcXWuAtSWrl3YXaDbU2ArRCCuzM42mP0GBJclD6e0GC3zEemmrjiMSOHcLPyRC4vOnAsnomJIw==" + }, "@svgr/babel-plugin-add-jsx-attribute": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-6.0.0.tgz", @@ -14703,6 +15032,11 @@ "integrity": "sha512-arSMRWIIFY0hV8pIxZMEfmMI47Wj3R/aWpZDDxWYCPEiOMv6tfOrnpDtgxBYPEQD4V0Y/958+1TdC3iWTFcUPw==", "dev": true }, + "csscolorparser": { + "version": "1.0.3", + "resolved": "https://registry.npmmirror.com/csscolorparser/-/csscolorparser-1.0.3.tgz", + "integrity": "sha512-umPSgYwZkdFoUrH5hIq5kf0wPSXiro51nPw0j2K/c83KflkPSTBGMz6NJvMB+07VlL0y7VPo6QJcDjcgKTTm3w==" + }, "cssdb": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/cssdb/-/cssdb-5.0.0.tgz", @@ -15924,6 +16258,20 @@ "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==", "dev": true }, + "geotiff": { + "version": "2.0.4", + "resolved": "https://registry.npmmirror.com/geotiff/-/geotiff-2.0.4.tgz", + "integrity": "sha512-aG8h9bJccGusioPsEWsEqx8qdXpZN71A20WCvRKGxcnHSOWLKmC5ZmsAmodfxb9TRQvs+89KikGuPzxchhA+Uw==", + "requires": { + "@petamoriken/float16": "^3.4.7", + "lerc": "^3.0.0", + "lru-cache": "^6.0.0", + "pako": "^2.0.4", + "parse-headers": "^2.0.2", + "web-worker": "^1.2.0", + "xml-utils": "^1.0.2" + } + }, "get-intrinsic": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.1.tgz", @@ -16285,6 +16633,11 @@ "dev": true, "requires": {} }, + "ieee754": { + "version": "1.2.1", + "resolved": "https://registry.npmmirror.com/ieee754/-/ieee754-1.2.1.tgz", + "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==" + }, "ignore": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz", @@ -16681,6 +17034,11 @@ "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=", "dev": true }, + "json-stringify-pretty-compact": { + "version": "2.0.0", + "resolved": "https://registry.npmmirror.com/json-stringify-pretty-compact/-/json-stringify-pretty-compact-2.0.0.tgz", + "integrity": "sha512-WRitRfs6BGq4q8gTgOy4ek7iPFXjbra0H3PmDLKm2xnZ+Gh1HUhiKGgCZkSPNULlP7mvfu6FV/mOLhCarspADQ==" + }, "json5": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz", @@ -16728,6 +17086,11 @@ "integrity": "sha512-pJiBpiXMbt7dkzXe8Ghj/u4FfXOOa98fPW+bihOJ4SjnoijweJrNThJfd3ifXpXhREjpoF2mZVH1GfS9LV3kHQ==", "dev": true }, + "lerc": { + "version": "3.0.0", + "resolved": "https://registry.npmmirror.com/lerc/-/lerc-3.0.0.tgz", + "integrity": "sha512-Rm4J/WaHhRa93nCN2mwWDZFoRVF18G1f47C+kvQWyHGEZxFpTUi73p7lMVSAndyxGt6lJ2/CFbOcf9ra5p8aww==" + }, "less": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/less/-/less-4.1.2.tgz", @@ -17134,7 +17497,6 @@ "version": "6.0.0", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", - "dev": true, "requires": { "yallist": "^4.0.0" } @@ -17148,6 +17510,11 @@ "semver": "^6.0.0" } }, + "mapbox-to-css-font": { + "version": "2.4.1", + "resolved": "https://registry.npmmirror.com/mapbox-to-css-font/-/mapbox-to-css-font-2.4.1.tgz", + "integrity": "sha512-QQ/iKiM43DM9+aujTL45Iz5o7gDeSFmy4LPl3HZmNcwCE++NxGazf+yFpY+wCb+YS23sDa1ghpo3zrNFOcHlow==" + }, "mdn-data": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz", @@ -17193,6 +17560,11 @@ "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=", "dev": true }, + "mgrs": { + "version": "1.0.0", + "resolved": "https://registry.npmmirror.com/mgrs/-/mgrs-1.0.0.tgz", + "integrity": "sha512-awNbTOqCxK1DBGjalK3xqWIstBZgN6fxsMSiXLs9/spqWkF2pAhb2rrYCFSsr1/tT7PhcDGjZndG8SWYn0byYA==" + }, "micromatch": { "version": "4.0.4", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.4.tgz", @@ -17230,6 +17602,56 @@ "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==", "dev": true }, + "mini-css-extract-plugin": { + "version": "2.6.0", + "resolved": "https://registry.npmmirror.com/mini-css-extract-plugin/-/mini-css-extract-plugin-2.6.0.tgz", + "integrity": "sha512-ndG8nxCEnAemsg4FSgS+yNyHKgkTB4nPKqCOgh65j3/30qqC5RaSQQXMm++Y6sb6E1zRSxPkztj9fqxhS1Eo6w==", + "dev": true, + "requires": { + "schema-utils": "^4.0.0" + }, + "dependencies": { + "ajv": { + "version": "8.10.0", + "resolved": "https://registry.npmmirror.com/ajv/-/ajv-8.10.0.tgz", + "integrity": "sha512-bzqAEZOjkrUMl2afH8dknrq5KEk2SrwdBROR+vH1EKVQTqaUbJVPdc/gEdggTMM0Se+s+Ja4ju4TlNcStKl2Hw==", + "dev": true, + "requires": { + "fast-deep-equal": "^3.1.1", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2", + "uri-js": "^4.2.2" + } + }, + "ajv-keywords": { + "version": "5.1.0", + "resolved": "https://registry.npmmirror.com/ajv-keywords/-/ajv-keywords-5.1.0.tgz", + "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==", + "dev": true, + "requires": { + "fast-deep-equal": "^3.1.3" + } + }, + "json-schema-traverse": { + "version": "1.0.0", + "resolved": "https://registry.npmmirror.com/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz", + "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==", + "dev": true + }, + "schema-utils": { + "version": "4.0.0", + "resolved": "https://registry.npmmirror.com/schema-utils/-/schema-utils-4.0.0.tgz", + "integrity": "sha512-1edyXKgh6XnJsJSQ8mKWXnN/BVaIbFMLpouRUrXgVq7WYne5kw3MW7UPhO44uRXQSIpTSXoJbmrR2X0w9kUTyg==", + "dev": true, + "requires": { + "@types/json-schema": "^7.0.9", + "ajv": "^8.8.0", + "ajv-formats": "^2.1.1", + "ajv-keywords": "^5.0.0" + } + } + } + }, "minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", @@ -17248,8 +17670,7 @@ "minimist": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz", - "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==", - "dev": true + "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==" }, "mkdirp": { "version": "0.5.5", @@ -17488,6 +17909,27 @@ "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==", "dev": true }, + "ol": { + "version": "6.13.0", + "resolved": "https://registry.npmmirror.com/ol/-/ol-6.13.0.tgz", + "integrity": "sha512-Fa6yt+FArWE9fwYRRhi/8+ULcFDRS2ZuDcLp3R9bQeDVa5T4E4TT9iqLeJhmHG+bzWiLWJHIeFUqw8GD2gW0YA==", + "requires": { + "geotiff": "^2.0.2", + "ol-mapbox-style": "^7.0.0", + "pbf": "3.2.1", + "rbush": "^3.0.1" + } + }, + "ol-mapbox-style": { + "version": "7.0.0", + "resolved": "https://registry.npmmirror.com/ol-mapbox-style/-/ol-mapbox-style-7.0.0.tgz", + "integrity": "sha512-y0OrKfx/TBcbGUf0UefDuYPSfMCCjPz0aUttm/kG461CNwzJpGavvf/lJ7nyNfeHSJFr0iEEdAbB98UUUQQkww==", + "requires": { + "@mapbox/mapbox-gl-style-spec": "^13.20.1", + "mapbox-to-css-font": "^2.4.1", + "webfont-matcher": "^1.1.0" + } + }, "on-finished": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz", @@ -17589,6 +18031,11 @@ "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==", "dev": true }, + "pako": { + "version": "2.0.4", + "resolved": "https://registry.npmmirror.com/pako/-/pako-2.0.4.tgz", + "integrity": "sha512-v8tweI900AUkZN6heMU/4Uy4cXRc2AYNRggVmTR+dEncawDJgCdLMximOVA2p4qO57WMynangsfGRb5WD6L1Bg==" + }, "param-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", @@ -17608,6 +18055,11 @@ "callsites": "^3.0.0" } }, + "parse-headers": { + "version": "2.0.4", + "resolved": "https://registry.npmmirror.com/parse-headers/-/parse-headers-2.0.4.tgz", + "integrity": "sha512-psZ9iZoCNFLrgRjZ1d8mn0h9WRqJwFxM9q3x7iUjN/YT2OksthDJ5TiPCu2F38kS4zutqfW+YdVVkBZZx3/1aw==" + }, "parse-json": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz", @@ -17678,6 +18130,15 @@ "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", "dev": true }, + "pbf": { + "version": "3.2.1", + "resolved": "https://registry.npmmirror.com/pbf/-/pbf-3.2.1.tgz", + "integrity": "sha512-ClrV7pNOn7rtmoQVF4TS1vyU0WhYRnP92fzbfF75jAIwpnzdJXf8iTd4CMEqO4yUenH6NDqLiwjqlh6QgZzgLQ==", + "requires": { + "ieee754": "^1.1.12", + "resolve-protobuf-schema": "^2.1.0" + } + }, "picocolors": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", @@ -18446,6 +18907,15 @@ "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==", "dev": true }, + "proj4": { + "version": "2.7.5", + "resolved": "https://registry.npmmirror.com/proj4/-/proj4-2.7.5.tgz", + "integrity": "sha512-5ecXUXbHAfvdhfBQpU7EhUfPCQGUCPmVup/4gnZA3bJY3JcK/xxzm4QQDz1xiXokN6ux65VDczlCtBtKrTSpAQ==", + "requires": { + "mgrs": "1.0.0", + "wkt-parser": "^1.3.1" + } + }, "prompts": { "version": "2.4.2", "resolved": "https://registry.npmjs.org/prompts/-/prompts-2.4.2.tgz", @@ -18466,6 +18936,11 @@ "react-is": "^16.13.1" } }, + "protocol-buffers-schema": { + "version": "3.6.0", + "resolved": "https://registry.npmmirror.com/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz", + "integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw==" + }, "proxy-addr": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz", @@ -18509,6 +18984,11 @@ "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", "dev": true }, + "quickselect": { + "version": "2.0.0", + "resolved": "https://registry.npmmirror.com/quickselect/-/quickselect-2.0.0.tgz", + "integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw==" + }, "randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -18544,6 +19024,14 @@ } } }, + "rbush": { + "version": "3.0.1", + "resolved": "https://registry.npmmirror.com/rbush/-/rbush-3.0.1.tgz", + "integrity": "sha512-XRaVO0YecOpEuIvbhbpTrZgoiI6xBlz6hnlr6EHhd+0x9ase6EmeN+hdwwUaJvLcsFFQ8iWVF1GAK1yB0BWi0w==", + "requires": { + "quickselect": "^2.0.0" + } + }, "react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", @@ -18971,6 +19459,14 @@ "integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==", "dev": true }, + "resolve-protobuf-schema": { + "version": "2.1.0", + "resolved": "https://registry.npmmirror.com/resolve-protobuf-schema/-/resolve-protobuf-schema-2.1.0.tgz", + "integrity": "sha512-kI5ffTiZWmJaS/huM8wZfEMer1eRd7oJQhDuxeCLe3t7N7mX3z94CN0xPxBQxFYQTSNz9T0i+v6inKqSdK8xrQ==", + "requires": { + "protocol-buffers-schema": "^3.3.1" + } + }, "resolve-url-loader": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-4.0.0.tgz", @@ -19059,6 +19555,11 @@ "queue-microtask": "^1.2.2" } }, + "rw": { + "version": "1.3.3", + "resolved": "https://registry.npmmirror.com/rw/-/rw-1.3.3.tgz", + "integrity": "sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==" + }, "rxjs": { "version": "7.5.1", "resolved": "https://registry.npmmirror.com/rxjs/download/rxjs-7.5.1.tgz", @@ -19319,6 +19820,25 @@ "websocket-driver": "^0.7.4" } }, + "sort-asc": { + "version": "0.1.0", + "resolved": "https://registry.npmmirror.com/sort-asc/-/sort-asc-0.1.0.tgz", + "integrity": "sha512-jBgdDd+rQ+HkZF2/OHCmace5dvpos/aWQpcxuyRs9QUbPRnkEJmYVo81PIGpjIdpOcsnJ4rGjStfDHsbn+UVyw==" + }, + "sort-desc": { + "version": "0.1.1", + "resolved": "https://registry.npmmirror.com/sort-desc/-/sort-desc-0.1.1.tgz", + "integrity": "sha512-jfZacW5SKOP97BF5rX5kQfJmRVZP5/adDUTY8fCSPvNcXDVpUEe2pr/iKGlcyZzchRJZrswnp68fgk3qBXgkJw==" + }, + "sort-object": { + "version": "0.3.2", + "resolved": "https://registry.npmmirror.com/sort-object/-/sort-object-0.3.2.tgz", + "integrity": "sha512-aAQiEdqFTTdsvUFxXm3umdo04J7MRljoVGbBlkH7BgNsMvVNAJyGj7C/wV1A8wHWAJj/YikeZbfuCKqhggNWGA==", + "requires": { + "sort-asc": "^0.1.0", + "sort-desc": "^0.1.1" + } + }, "source-list-map": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz", @@ -19823,6 +20343,16 @@ "minimalistic-assert": "^1.0.0" } }, + "web-worker": { + "version": "1.2.0", + "resolved": "https://registry.npmmirror.com/web-worker/-/web-worker-1.2.0.tgz", + "integrity": "sha512-PgF341avzqyx60neE9DD+XS26MMNMoUQRz9NOZwW32nPQrF6p77f1htcnjBSEV8BGMKZ16choqUG4hyI0Hx7mA==" + }, + "webfont-matcher": { + "version": "1.1.0", + "resolved": "https://registry.npmmirror.com/webfont-matcher/-/webfont-matcher-1.1.0.tgz", + "integrity": "sha512-ov8lMvF9wi4PD7fK2Axn9PQEpO9cYI0fIoGqErwd+wi8xacFFDmX114D5Q2Lw0Wlgmb+Qw/dKI2KTtimrJf85g==" + }, "webpack": { "version": "5.65.0", "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.65.0.tgz", @@ -20098,6 +20628,11 @@ "integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==", "dev": true }, + "wkt-parser": { + "version": "1.3.2", + "resolved": "https://registry.npmmirror.com/wkt-parser/-/wkt-parser-1.3.2.tgz", + "integrity": "sha512-A26BOOo7sHAagyxG7iuRhnKMO7Q3mEOiOT4oGUmohtN/Li5wameeU4S6f8vWw6NADTVKljBs8bzA8JPQgSEMVQ==" + }, "word-wrap": { "version": "1.2.3", "resolved": "https://registry.npmmirror.com/word-wrap/download/word-wrap-1.2.3.tgz", @@ -20192,11 +20727,15 @@ "dev": true, "requires": {} }, + "xml-utils": { + "version": "1.0.2", + "resolved": "https://registry.npmmirror.com/xml-utils/-/xml-utils-1.0.2.tgz", + "integrity": "sha512-rEn0FvKi+YGjv9omf22oAf+0d6Ly/sgJ/CUufU/nOzS7SRLmgwSujrewc03KojXxt+aPaTRpm593TgehtUBMSQ==" + }, "yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", - "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", - "dev": true + "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==" }, "yaml": { "version": "1.10.2", diff --git a/package.json b/package.json index eaf7823..5ee90f7 100644 --- a/package.json +++ b/package.json @@ -13,9 +13,12 @@ "author": "zhouxhere", "license": "ISC", "dependencies": { + "@amap/amap-jsapi-loader": "^1.0.1", "axios": "^0.24.0", "core-js": "^3.20.2", "moment": "^2.29.1", + "ol": "^6.13.0", + "proj4": "^2.7.5", "react": "^17.0.2", "react-dom": "^17.0.2", "react-redux": "^7.2.6", @@ -48,6 +51,7 @@ "less": "^4.1.2", "less-loader": "^10.2.0", "lint-staged": "^12.1.7", + "mini-css-extract-plugin": "^2.6.0", "postcss": "^8.4.5", "postcss-flexbugs-fixes": "^5.0.2", "postcss-loader": "^6.2.1", diff --git a/src/asset/style/global.less b/src/asset/style/global.less new file mode 100644 index 0000000..411c601 --- /dev/null +++ b/src/asset/style/global.less @@ -0,0 +1,162 @@ +html, +body, +#root { + width: 100%; + height: 100%; + margin: 0; + padding: 0; + overflow: hidden; + font-size: 12px; + line-height: 1; +} + +html, +body, +div, +span, +applet, +object, +iframe, +h1, +h2, +h3, +h4, +h5, +h6, +p, +blockquote, +pre, +a, +abbr, +acronym, +address, +big, +cite, +code, +del, +dfn, +em, +img, +ins, +kbd, +q, +s, +samp, +small, +strike, +strong, +sub, +sup, +tt, +var, +b, +u, +i, +center, +dl, +dt, +dd, +ol, +ul, +li, +fieldset, +form, +label, +legend, +table, +caption, +tbody, +tfoot, +thead, +tr, +th, +td, +article, +aside, +canvas, +details, +embed, +figure, +figcaption, +footer, +header, +hgroup, +menu, +nav, +output, +ruby, +section, +summary, +time, +mark, +audio, +video { + margin: 0; + padding: 0; + border: 0; +} +/* HTML5 display-role reset for older browsers */ +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; +} + +ol, +ul { + list-style: none; + margin-bottom: 0 !important; +} + +blockquote, +q { + quotes: none; +} + +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ''; + content: none; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +* { + box-sizing: border-box; +} +*::before, +*::after { + box-sizing: border-box; +} + +/* 设置滚动条的样式 */ +::-webkit-scrollbar { + width: 5px; +} +/* 滚动槽 */ +::-webkit-scrollbar-track { + -webkit-box-shadow: #d0d0d0; + border-radius: 10px; +} +/* 滚动条滑块 */ +::-webkit-scrollbar-thumb { + border-radius: 10px; + background: #d0d0d0; + -webkit-box-shadow: #d0d0d0; +} +::-webkit-scrollbar-thumb:window-inactive { + background: #d0d0d0; +} diff --git a/src/config/defaultApp.js b/src/config/defaultApp.js index a577904..02cba97 100644 --- a/src/config/defaultApp.js +++ b/src/config/defaultApp.js @@ -4,12 +4,12 @@ module.exports = { name: 'app', urls: { loginUrl: '/passport/login', - defaultUrl: '/home/index', + defaultUrl: '/map', }, redirects: [ { from: RouteCode.ROOT, - to: RouteCode.PAGE_HOME, + to: RouteCode.PAGE_MAP, }, ], } diff --git a/src/config/routeConstants.js b/src/config/routeConstants.js index f92c1d4..ccb3196 100644 --- a/src/config/routeConstants.js +++ b/src/config/routeConstants.js @@ -2,10 +2,12 @@ export const RoutePath = { ROOT: 'layout', LAYOUT_BASIC: 'layout/basic', PAGE_HOME: 'page/home', + PAGE_MAP: 'page/map', } export const RouteCode = { ROOT: 'LAYOUT', LAYOUT_BASIC: 'LAYOUT_BASIC', PAGE_HOME: 'PAGE_HOME', + PAGE_MAP: 'PAGE_MAP', } diff --git a/src/index.js b/src/index.js index 7935655..119aab9 100644 --- a/src/index.js +++ b/src/index.js @@ -7,6 +7,8 @@ import App from './App' import { Provider } from 'react-redux' import store from './store' +import './asset/style/global.less' + const element = ( diff --git a/src/page/map/amap.js b/src/page/map/amap.js new file mode 100644 index 0000000..9f34d84 --- /dev/null +++ b/src/page/map/amap.js @@ -0,0 +1,21 @@ +//获取当前时间 +var nowDate = new Date() +var year = nowDate.getFullYear() +var month = nowDate.getMonth() + 1 +var today = nowDate.getDate() +var hours = nowDate.getHours() +var minutes = nowDate.getMinutes() +var seconds = nowDate.getSeconds() + +if (month >= 1 && month <= 9) { + month = '0' + month +} +if (today >= 1 && today <= 9) { + today = '0' + today +} +var currentdate = + year + '-' + month + '-' + today + ' ' + hours + ':' + minutes + ':' + seconds +var longTime = new Date( + currentdate.replace(new RegExp('-', 'gm'), '/') +).getTime() +export default { longTime } diff --git a/src/page/map/gcj02Mector.js b/src/page/map/gcj02Mector.js new file mode 100644 index 0000000..e92cdeb --- /dev/null +++ b/src/page/map/gcj02Mector.js @@ -0,0 +1,97 @@ +// 导入proj控件,使用其方法注入gcj02坐标系 +import * as proj from 'ol/proj' +import gcj02 from 'util/gcj02' + +var forEachPoint = function (func) { + return function (input, opt_output, opt_dimension) { + var len = input.length + var dimension = opt_dimension ? opt_dimension : 2 + var output + if (opt_output) { + output = opt_output + } else { + if (dimension !== 2) { + output = input.slice() + } else { + output = new Array(len) + } + } + for (var offset = 0; offset < len; offset += dimension) { + func(input, output, offset) + } + return output + } +} + +var sphericalMercator = {} + +var RADIUS = 6378137 +var MAX_LATITUDE = 85.0511287798 +var RAD_PER_DEG = Math.PI / 180 + +sphericalMercator.forward = forEachPoint(function (input, output, offset) { + var lat = Math.max(Math.min(MAX_LATITUDE, input[offset + 1]), -MAX_LATITUDE) + var sin = Math.sin(lat * RAD_PER_DEG) + + output[offset] = RADIUS * input[offset] * RAD_PER_DEG + output[offset + 1] = (RADIUS * Math.log((1 + sin) / (1 - sin))) / 2 +}) + +sphericalMercator.inverse = forEachPoint(function (input, output, offset) { + output[offset] = input[offset] / RADIUS / RAD_PER_DEG + output[offset + 1] = + (2 * Math.atan(Math.exp(input[offset + 1] / RADIUS)) - Math.PI / 2) / + RAD_PER_DEG +}) + +var projzh = {} +projzh.ll2gmerc = function (input, opt_output, opt_dimension) { + let output = gcj02.fromWGS84(input, opt_output, opt_dimension) + return projzh.ll2smerc(output, output, opt_dimension) +} +projzh.gmerc2ll = function (input, opt_output, opt_dimension) { + let output = projzh.smerc2ll(input, input, opt_dimension) + return gcj02.toWGS84(output, opt_output, opt_dimension) +} +projzh.smerc2gmerc = function (input, opt_output, opt_dimension) { + let output = projzh.smerc2ll(input, input, opt_dimension) + output = gcj02.fromWGS84(output, output, opt_dimension) + return projzh.ll2smerc(output, output, opt_dimension) +} +projzh.gmerc2smerc = function (input, opt_output, opt_dimension) { + let output = projzh.smerc2ll(input, input, opt_dimension) + output = gcj02.toWGS84(output, output, opt_dimension) + return projzh.ll2smerc(output, output, opt_dimension) +} + +projzh.ll2smerc = sphericalMercator.forward +projzh.smerc2ll = sphericalMercator.inverse + +// 定义GCJ02 +const gcj02Extent = [ + -20037508.342789244, -20037508.342789244, 20037508.342789244, + 20037508.342789244, +] +const gcj02Mecator = new proj.Projection({ + code: 'GCJ-02', + extent: gcj02Extent, + units: 'm', +}) +proj.addProjection(gcj02Mecator) +// 将4326/3857转为gcj02坐标的方法定义 +proj.addCoordinateTransforms( + 'EPSG:4326', + gcj02Mecator, + projzh.ll2gmerc, + projzh.gmerc2ll +) +proj.addCoordinateTransforms( + 'EPSG:3857', + gcj02Mecator, + projzh.smerc2gmerc, + projzh.gmerc2smerc +) + +export default { gcj02Mecator, gcj02 } +// 我使用的react，所以这里需要导出定义的gcj02Mecator，提供给外部使用 +// export default gcj02Mecator diff --git a/src/page/map/index.js b/src/page/map/index.js new file mode 100644 index 0000000..b2e3058 --- /dev/null +++ b/src/page/map/index.js @@ -0,0 +1,387 @@ +import React, { useEffect, useState } from 'react' + +import style from './index.module.less' +import './map.less' + +import 'ol/ol.css' +import { View, Map } from 'ol' +import { register } from 'ol/proj/proj4' +import proj4 from 'proj4' +import { get, Projection, toLonLat, transformExtent } from 'ol/proj' +import { + Attribution, + FullScreen, + MousePosition, + Rotate, + ScaleLine, + Zoom, + ZoomSlider, +} from 'ol/control' +import { WMTSCapabilities } from 'ol/format' +import WMTS, { optionsFromCapabilities } from 'ol/source/WMTS' +import XYZ from 'ol/source/XYZ' +import { getWidth, getTopLeft } from 'ol/extent' +import WMTSTileGrid from 'ol/tilegrid/WMTS' +import TileLayer from 'ol/layer/Tile' + +import AMapLoader from '@amap/amap-jsapi-loader' +import amapUtil from './amap' +import './gcj02Mector' +import gcj02 from 'util/gcj02' +import LoadingControl from './loadingControl' +import TrafficControl from './trafficControl' +import VectorLayer from 'ol/layer/Vector' +import VectorSource from 'ol/source/Vector' +import Cluster from 'ol/source/Cluster' +import { GeoJSON } from 'ol/format' +import { Circle, Stroke, Style, Text, Fill } from 'ol/style' +// import { bbox } from 'ol/loadingstrategy' + +const MapPage = () => { + // eslint-disable-next-line no-unused-vars + const [map, setMap] = useState(null) + // const [layers, setLayers] = useState([]) + // const [markers, setMarkers] = useState([]) + + useEffect(async () => { + // await loadAMap() + registerProj4490() + renderMap() + console.log((await getWfs()).getSource().getFeatures()) + }, []) + + // eslint-disable-next-line no-unused-vars + const registerProj4490 = () => { + proj4.defs('EPSG:4490', '+proj=longlat +ellps=GRS80 +no_defs') + register(proj4) + + const proj4490 = new Projection({ + code: 'EPSG:4490', + extent: [-180, -90, 180, 90], + worldExtent: [-180, -90, 180, 90], + }) + return proj4490 + } + + // eslint-disable-next-line no-unused-vars + const loadAMap = async () => { + await AMapLoader.load({ + key: 'your key', + version: '2.0', + AMapUI: { + version: '1.1', + }, + }) + } + + // eslint-disable-next-line no-unused-vars + const renderMap = async () => { + let _map = new Map({ + controls: [ + new Zoom({ + className: 'control-zoom ol-zoom', + }), + new FullScreen({ + // className: 'control-fullscreen ol-full-screen', + }), + new MousePosition({ + className: 'control-position ol-mouse-position', + projection: 'EPSG:4490', + coordinateFormat: function (coordinate) { + // 原本经纬度 + // return format(coordinate, '{x}, {y}', 6) + // 高德经纬度 + return gcj02.fromWGS84(coordinate, []) + }, + }), + new Rotate({ + className: 'control-rotate ol-rotate', + }), + new ScaleLine({ + className: 'control-scale ol-scale-line', + }), + new ZoomSlider({ + className: 'ol-zoomslider control-slider', + }), + new Attribution({ + className: 'control-attribution ol-attribution', + collapsible: false, + collapsed: false, + }), + new LoadingControl({ key: 'loading' }), + new TrafficControl({ key: 'traffic' }), + ], + layers: [ + (await getTianditu())[0], + (await getTianditu())[1], + await getWfs(), + ], + view: new View({ + center: [0, 0], + zoom: 3, + minZoom: 1, + maxZoom: 19, + projection: get('EPSG:3857'), + constrainResolution: true, + smoothResolutionConstraint: true, + extent: transformExtent( + [73.62, 16.7, 134.77, 53.56], + 'EPSG:4490', + 'EPSG:3857' + ), + // extent: [73.62, 16.7, 134.77, 53.56], + showFullExtent: true, + }), + target: 'map', + }) + setMap(_map) + + let traffic = _map + .getLayers() + .getArray() + .find((p) => p.getProperties().key === 'amap-traffic') + if (traffic) { + setInterval(() => { + traffic.getSource().clear() + traffic.setSource( + new XYZ({ + url: `https://tm.amap.com/trafficengine/mapabc/traffictile??v=1.0&;t=1&x={x}&y={y}&z={z}&&t=${amapUtil.longTime}`, + projection: get('GCJ-02'), + minZoom: 7, + maxZoom: 20, + }) + ) + }, 1000 * 60) + } + _map.on('singleclick', async (event) => { + console.log(event) + console.log(gcj02.fromWGS84(toLonLat(event.coordinate, 'EPSG:3857'), [])) + }) + _map.on('change:layergroup', (event) => { + console.log(event) + }) + + let loading = _map + .getControls() + .getArray() + .find((p) => p.getProperties().key === 'loading') + if (loading) { + loading.show() + setTimeout(() => { + loading.hide() + }, 1000 * 3) + } + } + + // eslint-disable-next-line no-unused-vars + const getTianditu = async () => { + return Promise.all([ + fetch( + `http://t${Math.floor( + Math.random() * 7 + )}.tianditu.gov.cn/vec_w/wmts?request=GetCapabilities&service=wmts` + ), + fetch( + `http://t${Math.floor( + Math.random() * 7 + )}.tianditu.gov.cn/cva_w/wmts?request=GetCapabilities&service=wmts` + ), + ]) + .then((response) => { + return Promise.all(response.map((item) => item.text())) + }) + .then((text) => { + let projection = get('EPSG:3857') + let projectionExtent = projection.getExtent() + let size = getWidth(projectionExtent) / 256 + let resolutions = new Array(19) + let matrixIds = new Array(19) + for (let z = 1; z < 19; ++z) { + resolutions[z] = size / Math.pow(2, z) + matrixIds[z] = z + } + + return text.map((item, index) => { + let result = new WMTSCapabilities().read(item) + + let option = optionsFromCapabilities(result, { + layer: result.Contents.Layer[0].Identifier, + matrixSet: result.Contents.TileMatrixSet[0].Identifier, + }) + + option.projection = projection + option.tileGrid = new WMTSTileGrid({ + origin: getTopLeft(projectionExtent), + resolutions: resolutions, + matrixIds: matrixIds, + }) + + option.urls = option.urls.map((url) => url + 'tk=your token') + + let _url = option.urls[0] + for (let i = 1; i < 8; i++) { + option.urls.push(_url.replace('t0', `t${i}`)) + } + + return new TileLayer({ + key: `${result.Contents.Layer[0].Identifier}_${result.Contents.TileMatrixSet[0].Identifier}`, + source: new WMTS({ + ...option, + attributions: '©your company', + }), + zIndex: index * 2, + }) + }) + }) + } + + // eslint-disable-next-line no-unused-vars + const getWfs = async () => { + return await fetch( + 'https://gisserver.tianditu.gov.cn/TDTService/wfs?service=WFS&version=1.1.0&request=GetFeature&typename=TDTService:AGNP&outputFormat=application/json&srsname=EPSG:3857' + ) + .then((response) => response.json()) + .then((res) => { + // eslint-disable-next-line no-unused-vars + let features = new GeoJSON().readFeatures(res) + const styleCache = {} + return new VectorLayer({ + source: new Cluster({ + source: new VectorSource({ + features: features, + }), + }), + style: function (feature) { + const size = feature.get('features').length + let style = size === 1 ? null : styleCache[size] + if (!style) { + style = new Style({ + image: new Circle({ + radius: 10, + stroke: new Stroke({ + color: '#fff', + }), + fill: new Fill({ + color: '#3399CC', + }), + }), + text: new Text({ + text: + size === 1 + ? feature.get('features')[0].getProperties().NAME + : size.toString(), + fill: new Fill({ + color: '#fff', + }), + }), + }) + styleCache[size] = style + } + return style + }, + }) + }) + } + + // eslint-disable-next-line no-unused-vars + const getAMap = async () => { + let AMap + // eslint-disable-next-line no-undef + if (AMap === undefined) { + await AMapLoader.load({ + key: '2451a439b8ff9fce0c01fdfef55f1eb0', + version: '2.0', + AMapUI: { + version: '1.1', + }, + }).then((_map) => { + AMap = _map + }) + } + return [ + new TileLayer({ + source: new XYZ({ + // eslint-disable-next-line no-undef + url: new AMap.TileLayer() + .getTileUrl() + .replace( + '{1,2,3,4}', + (Math.floor(Math.random() * 4) + 1).toString() + ) + .replace('[x]', '{x}') + .replace('[y]', '{y}') + .replace('[z]', '{z}'), + projection: get('EPSG:3857'), + minZoom: 3, + maxZoom: 18, + }), + zIndex: 1, + }), + new TileLayer({ + source: new XYZ({ + // eslint-disable-next-line no-undef + url: new AMap.TileLayer.RoadNet() + .getTileUrl() + .replace( + '{1,2,3,4}', + (Math.floor(Math.random() * 4) + 1).toString() + ) + .replace('[x]', '{x}') + .replace('[y]', '{y}') + .replace('[z]', '{z}'), + projection: 'EPSG:4490', + crossOrigin: '*', + minZoom: 7, + maxZoom: 18, + }), + // zIndex: 1, + }), + new TileLayer({ + source: new XYZ({ + // eslint-disable-next-line no-undef + url: new AMap.TileLayer.Satellite() + .getTileUrl() + .replace( + '{1,2,3,4}', + (Math.floor(Math.random() * 4) + 1).toString() + ) + .replace('[x]', '{x}') + .replace('[y]', '{y}') + .replace('[z]', '{z}'), + projection: 'EPSG:4490', + crossOrigin: '*', + minZoom: 3, + maxZoom: 18, + }), + // zIndex: 1, + }), + new TileLayer({ + source: new XYZ({ + // eslint-disable-next-line no-undef + url: new AMap.TileLayer.Traffic() + .getTileUrl() + .replace( + '{1,2,3,4}', + (Math.floor(Math.random() * 4) + 1).toString() + ) + .replace('[x]', '{x}') + .replace('[y]', '{y}') + .replace('[z]', '{z}'), + projection: 'EPSG:4490', + crossOrigin: '*', + minZoom: 7, + maxZoom: 18, + }), + // zIndex: 1, + }), + ] + } + + return ( +
+
+
+ ) +} + +export default MapPage diff --git a/src/page/map/index.module.less b/src/page/map/index.module.less new file mode 100644 index 0000000..c83925d --- /dev/null +++ b/src/page/map/index.module.less @@ -0,0 +1,11 @@ +.map { + width: 100%; + height: 100%; + position: relative; +} + +.main { + width: 100%; + height: 100%; + position: absolute; +} diff --git a/src/page/map/loadingControl.js b/src/page/map/loadingControl.js new file mode 100644 index 0000000..39e9dbb --- /dev/null +++ b/src/page/map/loadingControl.js @@ -0,0 +1,42 @@ +import { Control } from 'ol/control' + +export default class LoadingControl extends Control { + constructor(opt_options) { + const _options = opt_options || {} + + const _root = document.createElement('div') + _root.className = 'ol-layer-data-loading' + _root.style = { + width: '100%', + height: '100%', + 'background-color': 'rgba(255,255,255,0.5)', + } + + const _box = document.createElement('span') + _box.className = 'ol-layer-spin-dot-spin' + + for (let i = 0; i < 4; i++) { + const _i = document.createElement('i') + _i.className = 'ol-layer-spin-dot-item dot' + i + _box.appendChild(_i) + } + _root.appendChild(_box) + + super({ + element: _root, + target: _options.target, + }) + + if (_options.key) { + this.set('key', _options.key) + } + } + + show = function () { + this.element.style.display = 'block' + } + + hide = function () { + this.element.style.display = 'none' + } +} diff --git a/src/page/map/map.less b/src/page/map/map.less new file mode 100644 index 0000000..8977824 --- /dev/null +++ b/src/page/map/map.less @@ -0,0 +1,143 @@ +.control { + &-zoom { + top: auto !important; + left: 1em !important; + right: auto !important; + bottom: 1em !important; + } + &-slider { + top: 1em !important; + left: 1em !important; + right: auto !important; + bottom: auto !important; + &-thumb { + left: auto !important; + } + } + &-rotate { + top: auto !important; + left: auto !important; + right: 81em !important; + bottom: 1em !important; + } + &-fullscreen { + top: 1em !important; + left: auto !important; + right: 1em !important; + bottom: auto !important; + } + &-scale { + top: auto !important; + left: 50% !important; + right: auto !important; + bottom: 1em !important; + } + &-attribution { + top: auto !important; + left: auto !important; + right: 1em !important; + bottom: 1em !important; + } + &-position { + top: auto !important; + left: auto !important; + right: 15% !important; + bottom: 1em !important; + } +} + +// traffic control +.control-traffic { + left: 3em; + bottom: 1em; + + &-select { + > button { + background-color: rgba(0, 60, 136, 0.8) !important; + } + } +} +.ol-touch .rotate-north { + left: 3em; + bottom: 1em; +} + +// loading control +.ol-layer-data-loading { + width: 100%; + height: 100%; + box-sizing: border-box; + margin: 0; + padding: 0; + font-size: 14px; + font-variant: tabular-nums; + line-height: 1.5; + list-style: none; + font-feature-settings: 'tnum'; + position: absolute; + display: none; + color: #6996ff; + text-align: center; + vertical-align: middle; + transition: transform 0.3 cubic-bezier(0.78, 0.14, 0.15, 0.86); + background-color: rgba(255, 255, 255, 0.5); + + .ol-layer-spin-dot-spin { + position: relative; + top: 50%; + font-size: 32px; + transform: rotate(45deg); + animation: antRotate 1.2s infinite linear; + display: inline-block; + width: 1em; + height: 1em; + + .ol-layer-spin-dot-item { + position: absolute; + display: block; + width: 9px; + height: 9px; + background-color: #6996ff; + border-radius: 100%; + transform: scale(0.75); + transform-origin: 50% 50%; + animation: antSpinMove 1s infinite linear alternate; + -webkit-animation: antSpinMove 1s infinite linear alternate; + + &.dot0 { + top: 0; + left: 0; + opacity: 1; + } + + &.dot1 { + top: 0; + right: 0; + opacity: 0.6; + } + + &.dot2 { + bottom: 0; + right: 0; + opacity: 0.3; + } + + &.dot3 { + bottom: 0; + left: 0; + opacity: 0.1; + } + } + } +} + +@keyframes antSpinMove { + to { + opacity: 1; + } +} +@keyframes antRotate { + to { + transform: rotate(405deg); + } +} diff --git a/src/page/map/trafficControl.js b/src/page/map/trafficControl.js new file mode 100644 index 0000000..8b5e228 --- /dev/null +++ b/src/page/map/trafficControl.js @@ -0,0 +1,125 @@ +import { Control } from 'ol/control' +import TileLayer from 'ol/layer/Tile' +import { get } from 'ol/proj' +import XYZ from 'ol/source/XYZ' + +import amapUtil from './amap' + +export default class TrafficControl extends Control { + constructor(opt_options) { + const _options = opt_options || {} + + const _root = document.createElement('div') + _root.className = 'control-traffic ol-unselectable ol-control' + + const _box = document.createElement('button') + _box.innerHTML = 'T' + + _root.appendChild(_box) + + super({ + element: _root, + target: _options.target, + }) + + if (_options.key) { + this.set('key', _options.key) + } + + this.loadTraffic = false + this.interv = null + + this.duration_ = + !isNaN(_options.duration) && _options.duration > 0 + ? _options.duration + : 1000 * 60 + this.autoLoad_ = _options.autoLoad !== undefined ? _options.autoLoad : false + + if (this.autoLoad_) { + this.addTrafficLayer() + } + + _box.addEventListener('click', this.handleClick.bind(this), false) + } + + handleClick() { + event.preventDefault() + if (!this.loadTraffic) { + this.addTrafficLayer() + } else { + this.delTrafficLayer() + } + } + + addTrafficLayer() { + let layer = this.getMap() + .getLayers() + .getArray() + .find((p) => p.getProperties().key === 'amap-traffic') + if (!layer) { + this.getMap().addLayer(this.getTrafficLayer()) + this.element.className = + 'control-traffic ol-unselectable control-traffic-select ol-control' + this.loadTraffic = true + layer = this.getMap() + .getLayers() + .getArray() + .find((p) => p.getProperties().key === 'amap-traffic') + if (!this.interv) { + this.interv = setInterval(() => { + layer.getSource().clear() + layer.setSource( + new XYZ({ + // url: `https://tm.amap.com/trafficengine/mapabc/traffictile??v=1.0&;t=1&x={x}&y={y}&z={z}&&t=${amapUtil.longTime}`, + tileUrlFunction: (tileCoord) => { + let _zoom = parseInt(this.getMap().getView().getZoom(), 10) + if (_zoom < 8 || _zoom > 18) return + let [z, x, y] = tileCoord + return `https://tm.amap.com/trafficengine/mapabc/traffictile??v=1.0&;t=1&x=${x}&y=${y}&z=${z}&&t=${amapUtil.longTime}` + }, + projection: get('GCJ-02'), + minZoom: 7, + maxZoom: 18, + }) + ) + }, this.duration_) + } + } + } + + delTrafficLayer() { + let layer = this.getMap() + .getLayers() + .getArray() + .find((p) => p.getProperties().key === 'amap-traffic') + if (layer) { + this.getMap().removeLayer(layer) + this.element.className = 'control-traffic ol-control' + this.loadTraffic = false + if (this.interv) { + clearInterval(this.interv) + this.interv = null + } + } + } + + getTrafficLayer() { + return new TileLayer({ + key: 'amap-traffic', + source: new XYZ({ + // url: `https://tm.amap.com/trafficengine/mapabc/traffictile??v=1.0&;t=1&x={x}&y={y}&z={z}&&t=${amapUtil.longTime}`, + tileUrlFunction: (tileCoord) => { + let _zoom = parseInt(this.getMap().getView().getZoom(), 10) + if (_zoom < 8 || _zoom > 18) return + let [z, x, y] = tileCoord + return `https://tm.amap.com/trafficengine/mapabc/traffictile??v=1.0&;t=1&x=${x}&y=${y}&z=${z}&&t=${amapUtil.longTime}` + }, + // projection: get('EPSG:3857'), + projection: get('GCJ-02'), + minZoom: 7, + maxZoom: 18, + }), + zIndex: 1, + }) + } +} diff --git a/src/router/index.js b/src/router/index.js index aaba76c..0429c89 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -12,13 +12,16 @@ const Router = () => { const processRoutes = (params) => { if (!params) return [] let allRedirects = routerTool.processRoutes(defaultRoutes, redirects) + console.log(allRedirects) let routes = params.map((item) => { let Component = lazy(() => import(`src/${item.component}`)) let redirect = allRedirects.find((p) => p.from === item.code) let props = { element: ( loading}> - + diff --git a/src/router/redirect.js b/src/router/redirect.js index a8f8bf8..72658d9 100644 --- a/src/router/redirect.js +++ b/src/router/redirect.js @@ -4,9 +4,11 @@ import { generatePath, useMatch, useNavigate } from 'react-router-dom' const Redirect = (props) => { const match = useMatch(props.redirect) + const isFrom = useMatch(props.from) const navigate = useNavigate() useEffect(() => { - if (props.redirect) { + console.log(props) + if (props.redirect && isFrom) { if (match) { navigate(generatePath(props.redirect, match.params)) } else { diff --git a/src/router/routes.js b/src/router/routes.js index 52ba3ec..6267fbb 100644 --- a/src/router/routes.js +++ b/src/router/routes.js @@ -21,6 +21,12 @@ export const defaultRoutes = [ }, ], }, + { + code: RouteCode.PAGE_MAP, + title: 'map', + path: 'map', + component: RoutePath.PAGE_MAP, + }, ], }, ] diff --git a/src/util/gcj02.js b/src/util/gcj02.js new file mode 100644 index 0000000..a59046d --- /dev/null +++ b/src/util/gcj02.js @@ -0,0 +1,114 @@ +var forEachPoint = function (func) { + return function (input, opt_output, opt_dimension) { + var len = input.length + var dimension = opt_dimension ? opt_dimension : 2 + var output + if (opt_output) { + output = opt_output + } else { + if (dimension !== 2) { + output = input.slice() + } else { + output = new Array(len) + } + } + for (var offset = 0; offset < len; offset += dimension) { + func(input, output, offset) + } + return output + } +} +var gcj02 = {} +// var i = 0 +var PI = Math.PI +var AXIS = 6378245.0 +// eslint-disable-next-line no-loss-of-precision +var OFFSET = 0.00669342162296594323 // (a^2 - b^2) / a^2 + +function delta(wgLon, wgLat) { + var dLat = transformLat(wgLon - 105.0, wgLat - 35.0) + var dLon = transformLon(wgLon - 105.0, wgLat - 35.0) + var radLat = (wgLat / 180.0) * PI + var magic = Math.sin(radLat) + magic = 1 - OFFSET * magic * magic + var sqrtMagic = Math.sqrt(magic) + dLat = (dLat * 180.0) / (((AXIS * (1 - OFFSET)) / (magic * sqrtMagic)) * PI) + dLon = (dLon * 180.0) / ((AXIS / sqrtMagic) * Math.cos(radLat) * PI) + return [dLon, dLat] +} + +function outOfChina(lon, lat) { + if (lon < 72.004 || lon > 137.8347) { + return true + } + if (lat < 0.8293 || lat > 55.8271) { + return true + } + return false +} + +function transformLat(x, y) { + var ret = + -100.0 + + 2.0 * x + + 3.0 * y + + 0.2 * y * y + + 0.1 * x * y + + 0.2 * Math.sqrt(Math.abs(x)) + ret += + ((20.0 * Math.sin(6.0 * x * PI) + 20.0 * Math.sin(2.0 * x * PI)) * 2.0) / + 3.0 + ret += + ((20.0 * Math.sin(y * PI) + 40.0 * Math.sin((y / 3.0) * PI)) * 2.0) / 3.0 + ret += + ((160.0 * Math.sin((y / 12.0) * PI) + 320 * Math.sin((y * PI) / 30.0)) * + 2.0) / + 3.0 + return ret +} + +function transformLon(x, y) { + var ret = + 300.0 + + x + + 2.0 * y + + 0.1 * x * x + + 0.1 * x * y + + 0.1 * Math.sqrt(Math.abs(x)) + ret += + ((20.0 * Math.sin(6.0 * x * PI) + 20.0 * Math.sin(2.0 * x * PI)) * 2.0) / + 3.0 + ret += + ((20.0 * Math.sin(x * PI) + 40.0 * Math.sin((x / 3.0) * PI)) * 2.0) / 3.0 + ret += + ((150.0 * Math.sin((x / 12.0) * PI) + 300.0 * Math.sin((x / 30.0) * PI)) * + 2.0) / + 3.0 + return ret +} + +gcj02.toWGS84 = forEachPoint(function (input, output, offset) { + var lng = input[offset] + var lat = input[offset + 1] + if (!outOfChina(lng, lat)) { + var deltaD = delta(lng, lat) + lng = lng - deltaD[0] + lat = lat - deltaD[1] + } + output[offset] = lng + output[offset + 1] = lat +}) + +gcj02.fromWGS84 = forEachPoint(function (input, output, offset) { + var lng = input[offset] + var lat = input[offset + 1] + if (!outOfChina(lng, lat)) { + var deltaD = delta(lng, lat) + lng = lng + deltaD[0] + lat = lat + deltaD[1] + } + output[offset] = lng + output[offset + 1] = lat +}) + +export default gcj02 diff --git a/src/util/router.js b/src/util/router.js index 0c4523e..83ed176 100644 --- a/src/util/router.js +++ b/src/util/router.js @@ -1,15 +1,21 @@ const findPath = (params, code) => { + let paths = [] for (let i = 0; i < params.length; i++) { if (params[i].code === code) { - return [params[i].path] - } else { - if (params[i].children) { - let childPath = findPath(params[i].children, code) - return childPath ? [params[i].path, ...childPath] : [] + paths = [params[i].path] + break + } + if (params[i].children) { + let childPath = findPath(params[i].children, code) + if (childPath.length > 0) { + paths = [params[i].path, ...childPath] } - return [] + } + if (i === params.length - 1) { + break } } + return paths } const processRoutes = (routes, redirects) => { @@ -17,10 +23,14 @@ const processRoutes = (routes, redirects) => { let fromUrl = findPath(routes, item.from) if (fromUrl.length > 0) { fromUrl = fromUrl.join('/').replace('//', '/') + } else { + fromUrl = '' } let toUrl = findPath(routes, item.to) if (toUrl.length > 0) { toUrl = toUrl.join('/').replace('//', '/') + } else { + toUrl = '' } return { ...item, diff --git a/webpack.common.js b/webpack.common.js index 5f2c473..cb815af 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -79,7 +79,10 @@ module.exports = { loader: require.resolve('css-loader'), options: { importLoaders: 1, - modules: true, + modules: { + auto: true, + localIdentName: '[name]__[hash:base64:8]', + }, }, }, require.resolve('postcss-loader'), @@ -112,7 +115,10 @@ module.exports = { loader: require.resolve('css-loader'), options: { importLoaders: 3, - modules: true, + modules: { + auto: true, + localIdentName: '[local]__[hash:base64:8]', + }, }, }, require.resolve('postcss-loader'), @@ -139,7 +145,13 @@ module.exports = { ], alias: { 'react-native': 'react-native-web', - src: path.resolve(__dirname, 'src'), + src: path.resolve(__dirname, 'src/'), + config: path.resolve(__dirname, 'src/config'), + layout: path.resolve(__dirname, 'src/layout'), + page: path.resolve(__dirname, 'src/page'), + router: path.resolve(__dirname, 'src/router'), + store: path.resolve(__dirname, 'src/store'), + util: path.resolve(__dirname, 'src/util'), }, }, plugins: [ diff --git a/webpack.prod.js b/webpack.prod.js index 01636bf..4c966f9 100644 --- a/webpack.prod.js +++ b/webpack.prod.js @@ -8,7 +8,7 @@ const CssMinimizerPlugin = require('css-minimizer-webpack-plugin') module.exports = merge(common, { mode: 'production', output: { - fileName: 'static/js/[name].[contenthash:8].js', + filename: 'static/js/[name].[contenthash:8].js', chunkFilename: 'static/js/[name].[contenthash:8].chunk.js', }, optimization: {