From 08a6bc45c3a431d5f0903066ceb2926bdbf2364f Mon Sep 17 00:00:00 2001 From: eden Date: Fri, 15 Sep 2023 11:13:35 +0800 Subject: [PATCH] init Circle maker --- package-lock.json | 244 ++++++++++++++++-------- src/constants/map.ts | 4 +- src/hooks/use-g-map-cover.ts | 37 +++- src/hooks/use-g-map-wayline.ts | 2 +- src/hooks/use-mouse-tool.ts | 16 +- src/pages/page-web/projects/layer.vue | 6 + src/pages/page-web/projects/wayline.vue | 2 +- src/utils/genjson.ts | 4 +- src/utils/map-layer-utils.ts | 7 +- yarn.lock | 76 ++++++-- 10 files changed, 285 insertions(+), 113 deletions(-) diff --git a/package-lock.json b/package-lock.json index 47e9d0c..2288fee 100644 --- a/package-lock.json +++ b/package-lock.json @@ -52,6 +52,7 @@ "vite-plugin-style-import": "^1.0.1", "vite-plugin-svg-icons": "^1.0.5", "vite-plugin-vconsole": "^1.1.0", + "vue-eslint-parser": "^9.3.1", "vue-tsc": "^0.0.24" } }, @@ -2308,11 +2309,15 @@ "integrity": "sha512-ZVxXaNy28/k3kJg0Fou5MiYpp88j7H9hLZp8PDC3jV0WFjfH5E9xHb56L0W59cPbKbcHXeP4qyT8PrHp8t6LcQ==", "license": "MIT" }, + "node_modules/dayjs": { + "version": "1.11.9", + "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.9.tgz", + "integrity": "sha512-QvzAURSbQ0pKdIye2txOzNaHmxtUBXerpY0FJsFXUMKbIZeFm5ht1LS/jFsrncjnmtv8HsG0W2g6c0zUjZWmpA==" + }, "node_modules/debug": { - "version": "4.3.3", - "resolved": "https://registry.npmmirror.com/debug/download/debug-4.3.3.tgz", - "integrity": "sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==", - "license": "MIT", + "version": "4.3.4", + "resolved": "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz", + "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==", "dependencies": { "ms": "2.1.2" }, @@ -3264,6 +3269,20 @@ "node": ">=4" } }, + "node_modules/eslint-plugin-vue/node_modules/espree": { + "version": "6.2.1", + "resolved": "https://registry.npmmirror.com/espree/-/espree-6.2.1.tgz", + "integrity": "sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==", + "dev": true, + "dependencies": { + "acorn": "^7.1.1", + "acorn-jsx": "^5.2.0", + "eslint-visitor-keys": "^1.1.0" + }, + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/eslint-plugin-vue/node_modules/semver": { "version": "6.3.0", "resolved": "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz", @@ -3274,6 +3293,27 @@ "semver": "bin/semver.js" } }, + "node_modules/eslint-plugin-vue/node_modules/vue-eslint-parser": { + "version": "7.11.0", + "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz", + "integrity": "sha512-qh3VhDLeh773wjgNTl7ss0VejY9bMMa0GoDG2fQVyDzRFdiU3L7fw74tWZDHNQXdZqxO3EveQroa9ct39D2nqg==", + "dev": true, + "dependencies": { + "debug": "^4.1.1", + "eslint-scope": "^5.1.1", + "eslint-visitor-keys": "^1.1.0", + "espree": "^6.2.1", + "esquery": "^1.4.0", + "lodash": "^4.17.21", + "semver": "^6.3.0" + }, + "engines": { + "node": ">=8.10" + }, + "peerDependencies": { + "eslint": ">=5.0.0" + } + }, "node_modules/eslint-scope": { "version": "5.1.1", "resolved": "https://registry.npmmirror.com/eslint-scope/download/eslint-scope-5.1.1.tgz?cache=0&sync_timestamp=1637466913662&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-scope%2Fdownload%2Feslint-scope-5.1.1.tgz", @@ -3318,11 +3358,10 @@ } }, "node_modules/eslint-visitor-keys": { - "version": "3.1.0", - "resolved": "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-3.1.0.tgz?cache=0&sync_timestamp=1636378395014&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-3.1.0.tgz", - "integrity": "sha512-yWJFpu4DtjsWKkt5GeNBBuZMlNcYVs6vRCLoCVEJrTjaSB6LC98gFipNK/erM2Heg/E8mIK+hXG/pJMLK+eRZA==", + "version": "3.4.3", + "resolved": "https://registry.npmmirror.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz", + "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==", "dev": true, - "license": "Apache-2.0", "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } @@ -6242,11 +6281,10 @@ } }, "node_modules/semver": { - "version": "7.3.5", - "resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz", - "integrity": "sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=", + "version": "7.5.4", + "resolved": "https://registry.npmmirror.com/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", "dev": true, - "license": "ISC", "dependencies": { "lru-cache": "^6.0.0" }, @@ -7967,63 +8005,72 @@ "license": "MIT" }, "node_modules/vue-eslint-parser": { - "version": "7.11.0", - "resolved": "https://registry.npmmirror.com/vue-eslint-parser/download/vue-eslint-parser-7.11.0.tgz", - "integrity": "sha1-IUtd6pYQB/z/su5luJEjB2KNDa8=", + "version": "9.3.1", + "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-9.3.1.tgz", + "integrity": "sha512-Clr85iD2XFZ3lJ52/ppmUDG/spxQu6+MAeHXjjyI4I1NUYZ9xmenQp4N0oaHJhrA8OOxltCVxMRfANGa70vU0g==", "dev": true, - "license": "MIT", "dependencies": { - "debug": "^4.1.1", - "eslint-scope": "^5.1.1", - "eslint-visitor-keys": "^1.1.0", - "espree": "^6.2.1", + "debug": "^4.3.4", + "eslint-scope": "^7.1.1", + "eslint-visitor-keys": "^3.3.0", + "espree": "^9.3.1", "esquery": "^1.4.0", "lodash": "^4.17.21", - "semver": "^6.3.0" + "semver": "^7.3.6" }, "engines": { - "node": ">=8.10" - }, - "funding": { - "url": "https://github.com/sponsors/mysticatea" + "node": "^14.17.0 || >=16.0.0" }, "peerDependencies": { - "eslint": ">=5.0.0" + "eslint": ">=6.0.0" } }, - "node_modules/vue-eslint-parser/node_modules/eslint-visitor-keys": { - "version": "1.3.0", - "resolved": "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-1.3.0.tgz?cache=0&sync_timestamp=1636378395014&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-1.3.0.tgz", - "integrity": "sha1-MOvR73wv3/AcOk8VEESvJfqwUj4=", + "node_modules/vue-eslint-parser/node_modules/acorn": { + "version": "8.10.0", + "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.10.0.tgz", + "integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==", "dev": true, - "license": "Apache-2.0", + "bin": { + "acorn": "bin/acorn" + }, "engines": { - "node": ">=4" + "node": ">=0.4.0" + } + }, + "node_modules/vue-eslint-parser/node_modules/eslint-scope": { + "version": "7.2.2", + "resolved": "https://registry.npmmirror.com/eslint-scope/-/eslint-scope-7.2.2.tgz", + "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==", + "dev": true, + "dependencies": { + "esrecurse": "^4.3.0", + "estraverse": "^5.2.0" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, "node_modules/vue-eslint-parser/node_modules/espree": { - "version": "6.2.1", - "resolved": "https://registry.npmmirror.com/espree/download/espree-6.2.1.tgz", - "integrity": "sha1-d/xy4f10SiBSwg84pbV1gy6Cc0o=", + "version": "9.6.1", + "resolved": "https://registry.npmmirror.com/espree/-/espree-9.6.1.tgz", + "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==", "dev": true, - "license": "BSD-2-Clause", "dependencies": { - "acorn": "^7.1.1", - "acorn-jsx": "^5.2.0", - "eslint-visitor-keys": "^1.1.0" + "acorn": "^8.9.0", + "acorn-jsx": "^5.3.2", + "eslint-visitor-keys": "^3.4.1" }, "engines": { - "node": ">=6.0.0" + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, - "node_modules/vue-eslint-parser/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz", - "integrity": "sha1-7gpkyK9ejO6mdoexM3YeG+y9HT0=", + "node_modules/vue-eslint-parser/node_modules/estraverse": { + "version": "5.3.0", + "resolved": "https://registry.npmmirror.com/estraverse/-/estraverse-5.3.0.tgz", + "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==", "dev": true, - "license": "ISC", - "bin": { - "semver": "bin/semver.js" + "engines": { + "node": ">=4.0" } }, "node_modules/vue-i18n": { @@ -9789,10 +9836,15 @@ "resolved": "https://registry.npmmirror.com/csstype/download/csstype-2.6.19.tgz?cache=0&sync_timestamp=1637224514674&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fcsstype%2Fdownload%2Fcsstype-2.6.19.tgz", "integrity": "sha512-ZVxXaNy28/k3kJg0Fou5MiYpp88j7H9hLZp8PDC3jV0WFjfH5E9xHb56L0W59cPbKbcHXeP4qyT8PrHp8t6LcQ==" }, + "dayjs": { + "version": "1.11.9", + "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.9.tgz", + "integrity": "sha512-QvzAURSbQ0pKdIye2txOzNaHmxtUBXerpY0FJsFXUMKbIZeFm5ht1LS/jFsrncjnmtv8HsG0W2g6c0zUjZWmpA==" + }, "debug": { - "version": "4.3.3", - "resolved": "https://registry.npmmirror.com/debug/download/debug-4.3.3.tgz", - "integrity": "sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==", + "version": "4.3.4", + "resolved": "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz", + "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==", "requires": { "ms": "2.1.2" } @@ -10462,11 +10514,37 @@ "integrity": "sha1-MOvR73wv3/AcOk8VEESvJfqwUj4=", "dev": true }, + "espree": { + "version": "6.2.1", + "resolved": "https://registry.npmmirror.com/espree/-/espree-6.2.1.tgz", + "integrity": "sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==", + "dev": true, + "requires": { + "acorn": "^7.1.1", + "acorn-jsx": "^5.2.0", + "eslint-visitor-keys": "^1.1.0" + } + }, "semver": { "version": "6.3.0", "resolved": "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz", "integrity": "sha1-7gpkyK9ejO6mdoexM3YeG+y9HT0=", "dev": true + }, + "vue-eslint-parser": { + "version": "7.11.0", + "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz", + "integrity": "sha512-qh3VhDLeh773wjgNTl7ss0VejY9bMMa0GoDG2fQVyDzRFdiU3L7fw74tWZDHNQXdZqxO3EveQroa9ct39D2nqg==", + "dev": true, + "requires": { + "debug": "^4.1.1", + "eslint-scope": "^5.1.1", + "eslint-visitor-keys": "^1.1.0", + "espree": "^6.2.1", + "esquery": "^1.4.0", + "lodash": "^4.17.21", + "semver": "^6.3.0" + } } } }, @@ -10498,9 +10576,9 @@ } }, "eslint-visitor-keys": { - "version": "3.1.0", - "resolved": "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-3.1.0.tgz?cache=0&sync_timestamp=1636378395014&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-3.1.0.tgz", - "integrity": "sha512-yWJFpu4DtjsWKkt5GeNBBuZMlNcYVs6vRCLoCVEJrTjaSB6LC98gFipNK/erM2Heg/E8mIK+hXG/pJMLK+eRZA==", + "version": "3.4.3", + "resolved": "https://registry.npmmirror.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz", + "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==", "dev": true }, "espree": { @@ -12523,9 +12601,9 @@ } }, "semver": { - "version": "7.3.5", - "resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz", - "integrity": "sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=", + "version": "7.5.4", + "resolved": "https://registry.npmmirror.com/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", "dev": true, "requires": { "lru-cache": "^6.0.0" @@ -13794,41 +13872,51 @@ "integrity": "sha1-0kHQoEMdoHlYN2UdELTXPnyNPo0=" }, "vue-eslint-parser": { - "version": "7.11.0", - "resolved": "https://registry.npmmirror.com/vue-eslint-parser/download/vue-eslint-parser-7.11.0.tgz", - "integrity": "sha1-IUtd6pYQB/z/su5luJEjB2KNDa8=", + "version": "9.3.1", + "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-9.3.1.tgz", + "integrity": "sha512-Clr85iD2XFZ3lJ52/ppmUDG/spxQu6+MAeHXjjyI4I1NUYZ9xmenQp4N0oaHJhrA8OOxltCVxMRfANGa70vU0g==", "dev": true, "requires": { - "debug": "^4.1.1", - "eslint-scope": "^5.1.1", - "eslint-visitor-keys": "^1.1.0", - "espree": "^6.2.1", + "debug": "^4.3.4", + "eslint-scope": "^7.1.1", + "eslint-visitor-keys": "^3.3.0", + "espree": "^9.3.1", "esquery": "^1.4.0", "lodash": "^4.17.21", - "semver": "^6.3.0" + "semver": "^7.3.6" }, "dependencies": { - "eslint-visitor-keys": { - "version": "1.3.0", - "resolved": "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-1.3.0.tgz?cache=0&sync_timestamp=1636378395014&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-1.3.0.tgz", - "integrity": "sha1-MOvR73wv3/AcOk8VEESvJfqwUj4=", + "acorn": { + "version": "8.10.0", + "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.10.0.tgz", + "integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==", "dev": true }, + "eslint-scope": { + "version": "7.2.2", + "resolved": "https://registry.npmmirror.com/eslint-scope/-/eslint-scope-7.2.2.tgz", + "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==", + "dev": true, + "requires": { + "esrecurse": "^4.3.0", + "estraverse": "^5.2.0" + } + }, "espree": { - "version": "6.2.1", - "resolved": "https://registry.npmmirror.com/espree/download/espree-6.2.1.tgz", - "integrity": "sha1-d/xy4f10SiBSwg84pbV1gy6Cc0o=", + "version": "9.6.1", + "resolved": "https://registry.npmmirror.com/espree/-/espree-9.6.1.tgz", + "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==", "dev": true, "requires": { - "acorn": "^7.1.1", - "acorn-jsx": "^5.2.0", - "eslint-visitor-keys": "^1.1.0" + "acorn": "^8.9.0", + "acorn-jsx": "^5.3.2", + "eslint-visitor-keys": "^3.4.1" } }, - "semver": { - "version": "6.3.0", - "resolved": "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz", - "integrity": "sha1-7gpkyK9ejO6mdoexM3YeG+y9HT0=", + "estraverse": { + "version": "5.3.0", + "resolved": "https://registry.npmmirror.com/estraverse/-/estraverse-5.3.0.tgz", + "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==", "dev": true } } diff --git a/src/constants/map.ts b/src/constants/map.ts index 7c64138..1304fe5 100644 --- a/src/constants/map.ts +++ b/src/constants/map.ts @@ -13,7 +13,7 @@ export enum MapDoodleColor { PinColor = '#2D8CF0', PolylineColor = '#3366FF', PolygonColor = '#FF33FF', - CircleColor='pink' + CircleColor = '#FFBB00' } export enum MapElementEnum { @@ -22,4 +22,4 @@ export enum MapElementEnum { POLY = 2, CIR = 3 } -export type MapDoodleType = 'pin' | 'polyline' | 'polygon' | 'off' +export type MapDoodleType = 'pin' | 'polyline' | 'polygon' | 'circle' |'off' diff --git a/src/hooks/use-g-map-cover.ts b/src/hooks/use-g-map-cover.ts index 9631783..f5c913e 100644 --- a/src/hooks/use-g-map-cover.ts +++ b/src/hooks/use-g-map-cover.ts @@ -67,6 +67,27 @@ export function useGMapCover () { AddCoverToMap(pin) } + function initCircle (name: string, coordinates:GeojsonCoordinate, color?:string, data?:{}) { + // 创建圆形 Circle实例 + const circle = new AMap.Circle({ + center: [coordinates[0], coordinates[1]], + radius: coordinates[2], + borderWeight: 3, + strokeColor: '#FF33FF', + strokeOpacity: 1, + strokeWeight: 6, + strokeOpacity: 0.2, + fillOpacity: 0.4, + strokeStyle: 'dashed', + strokeDasharray: [10, 10], + // 线样式还支持 'dashed' + fillColor: color, + zIndex: 50, + }) + + AddCoverToMap(circle) + } + function AddOverlayGroup (overlayGroup) { root.$map.add(overlayGroup) coverList.push(overlayGroup) @@ -211,12 +232,26 @@ export function useGMapCover () { } } + function calculateDistance (lat1:number, lon1:number, lat2:number, lon2:number) :number { + const p1 = [lat1, lon1] + const p2 = [lat2, lon2] + // 返回 p1 到 p2 间的地面距离，单位：米 + return root.$aMap.GeometryUtil.distance(p1, p2) + } + + function ringArea (coordinates:GeojsonCoordinate[]) :number { + return root.$aMap.GeometryUtil.ringArea(coordinates) + } + return { init2DPin, initPolyline, initPolygon, + initCircle, removeCoverFromMap, getElementFromMap, - updatePinElement + updatePinElement, + calculateDistance, + ringArea } } diff --git a/src/hooks/use-g-map-wayline.ts b/src/hooks/use-g-map-wayline.ts index 27b788f..000845c 100644 --- a/src/hooks/use-g-map-wayline.ts +++ b/src/hooks/use-g-map-wayline.ts @@ -15,6 +15,6 @@ export function initPloyline (path:GeojsonCoordinate[]) { }) map.add(polyline) map.setCenter(path[0]) - map.setZoom(12) + map.setZoom(14) return polyline } diff --git a/src/hooks/use-mouse-tool.ts b/src/hooks/use-mouse-tool.ts index 4c38973..cc7b325 100644 --- a/src/hooks/use-mouse-tool.ts +++ b/src/hooks/use-mouse-tool.ts @@ -50,13 +50,15 @@ export function useMouseTool () { function drawCircle (type:MapDoodleType, getDrawCallback:Function) { root?.$mouseTool.circle({ strokeColor: "#FF33FF", - strokeOpacity: 1, - strokeWeight: 6, - strokeOpacity: 0.2, - fillColor: '#1791fc', - fillOpacity: 0.4, - strokeStyle: 'solid', - }) + strokeOpacity: 1, + strokeWeight: 6, + strokeOpacity: 0.2, + fillColor: '#1791fc', + fillOpacity: 0.4, + strokeStyle: 'solid', + // 线样式还支持 'dashed' + // strokeDasharray: [30,10], + }) root?.$mouseTool.on('draw', getDrawCallback) } function drawOff (type:MapDoodleType) { diff --git a/src/pages/page-web/projects/layer.vue b/src/pages/page-web/projects/layer.vue index ba8ac84..0b9240f 100644 --- a/src/pages/page-web/projects/layer.vue +++ b/src/pages/page-web/projects/layer.vue @@ -273,6 +273,12 @@ function updateMapElement ( id: id, name: name, }) + } else if (MapElementEnum.CIR === type && geoType === 'Circle') { + const coordinates = element.resource?.content.geometry.coordinates as GeojsonCoordinate + useGMapCoverHook.initCircle(name, coordinates, color, { + id: id, + name: name, + }) } } function checkLayer (keys: string[]) { diff --git a/src/pages/page-web/projects/wayline.vue b/src/pages/page-web/projects/wayline.vue index e0daabd..964b5cd 100644 --- a/src/pages/page-web/projects/wayline.vue +++ b/src/pages/page-web/projects/wayline.vue @@ -101,7 +101,7 @@ import { CURRENT_CONFIG } from '/@/api/http/config' import { load } from '@amap/amap-jsapi-loader' import { getRoot } from '/@/root' import { wgs84togcj02 } from '/@/vendors/coordtransform' -import {initPloyline} from '/@/hooks/use-g-map-wayline.ts' +import { initPloyline } from '/@/hooks/use-g-map-wayline.ts' import line from '/@/assets/icons/line.svg' const lineType = ref(['航点飞行', '航点飞行', '建图航拍', '倾斜摄影', '带状航线']) const polyline = ref() diff --git a/src/utils/genjson.ts b/src/utils/genjson.ts index d1dbaa7..8c9de31 100644 --- a/src/utils/genjson.ts +++ b/src/utils/genjson.ts @@ -89,13 +89,13 @@ export function generatePoint (position: MapGeographicPosition, properties: Geoj }, } } -export function generateCircle (position: GeojsonCoordinate, properties: GeojsonCircle['properties']): GeojsonFeature { +export function generateCircle (position: MapGeographicPosition, properties: GeojsonCircle['properties']): GeojsonFeature { return { type: 'Feature', properties, geometry: { type: 'Circle', - coordinates: position, + coordinates: geographic2Coordinate(position), }, } } diff --git a/src/utils/map-layer-utils.ts b/src/utils/map-layer-utils.ts index 0c14e49..e971ef6 100644 --- a/src/utils/map-layer-utils.ts +++ b/src/utils/map-layer-utils.ts @@ -4,7 +4,7 @@ import { MapDoodleColor, MapElementEnum } from '/@/constants/map' function getPinPosition (pinAMapPosition: pinAMapPosition):MapGeographicPosition { return { height: 0, latitude: pinAMapPosition.lat, longitude: pinAMapPosition.lng } } -export type GeojsonCoordinate = [number, number, number?] + export function generatePointContent (pinAMapPosition: pinAMapPosition) { const position = getPinPosition(pinAMapPosition) return { @@ -15,10 +15,11 @@ export function generatePointContent (pinAMapPosition: pinAMapPosition) { }) } } -export function generateCircleContent (pinAMapPosition: GeojsonCoordinate) { +export function generateCircleContent (circleAMapPosition: pinAMapPosition, radius:number) { + const position = { height: radius, latitude: circleAMapPosition.lat, longitude: circleAMapPosition.lng } return { type: MapElementEnum.CIR, - content: generateCircle(pinAMapPosition, { + content: generateCircle(position, { color: MapDoodleColor.CircleColor, clampToGround: true, }) diff --git a/yarn.lock b/yarn.lock index 309d798..0c133a3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -603,7 +603,7 @@ "resolved" "https://registry.npmmirror.com/@vue/shared/download/@vue/shared-3.2.26.tgz" "version" "3.2.26" -"acorn-jsx@^5.2.0", "acorn-jsx@^5.3.1": +"acorn-jsx@^5.2.0", "acorn-jsx@^5.3.1", "acorn-jsx@^5.3.2": "integrity" "sha1-ftW7VZCLOy8bxVxq8WU7rafweTc=" "resolved" "https://registry.nlark.com/acorn-jsx/download/acorn-jsx-5.3.2.tgz" "version" "5.3.2" @@ -613,6 +613,11 @@ "resolved" "https://registry.npmmirror.com/acorn/download/acorn-7.4.1.tgz" "version" "7.4.1" +"acorn@^8.9.0": + "integrity" "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==" + "resolved" "https://registry.npmmirror.com/acorn/-/acorn-8.10.0.tgz" + "version" "8.10.0" + "agora-rtc-sdk-ng@^4.12.1": "integrity" "sha512-kmc+ZyKDdnY/BN3iAwBs+MSgTX8Zkc6THFSIAXN9WebjZ/F+N/JXItoNEcgQe3MdTABUli6w3pZ+iObnDqVkBw==" "resolved" "https://registry.npmmirror.com/agora-rtc-sdk-ng/-/agora-rtc-sdk-ng-4.12.1.tgz" @@ -1233,6 +1238,11 @@ "resolved" "https://registry.npmmirror.com/csstype/download/csstype-2.6.19.tgz?cache=0&sync_timestamp=1637224514674&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fcsstype%2Fdownload%2Fcsstype-2.6.19.tgz" "version" "2.6.19" +"dayjs@^1.11.9": + "integrity" "sha512-QvzAURSbQ0pKdIye2txOzNaHmxtUBXerpY0FJsFXUMKbIZeFm5ht1LS/jFsrncjnmtv8HsG0W2g6c0zUjZWmpA==" + "resolved" "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.9.tgz" + "version" "1.11.9" + "debug@^2.2.0": "integrity" "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==" "resolved" "https://registry.npmmirror.com/debug/download/debug-2.6.9.tgz" @@ -1261,10 +1271,10 @@ dependencies: "ms" "^2.1.1" -"debug@^4.0.1", "debug@^4.1.0", "debug@^4.1.1", "debug@^4.3.1", "debug@^4.3.2", "debug@^4.3.3": - "integrity" "sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==" - "resolved" "https://registry.npmmirror.com/debug/download/debug-4.3.3.tgz" - "version" "4.3.3" +"debug@^4.0.1", "debug@^4.1.0", "debug@^4.1.1", "debug@^4.3.1", "debug@^4.3.2", "debug@^4.3.3", "debug@^4.3.4": + "integrity" "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==" + "resolved" "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz" + "version" "4.3.4" dependencies: "ms" "2.1.2" @@ -1636,6 +1646,14 @@ "esrecurse" "^4.3.0" "estraverse" "^4.1.1" +"eslint-scope@^7.1.1": + "integrity" "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==" + "resolved" "https://registry.npmmirror.com/eslint-scope/-/eslint-scope-7.2.2.tgz" + "version" "7.2.2" + dependencies: + "esrecurse" "^4.3.0" + "estraverse" "^5.2.0" + "eslint-utils@^2.0.0": "integrity" "sha1-0t5eA0JOcH3BDHQGjd7a5wh0Gyc=" "resolved" "https://registry.nlark.com/eslint-utils/download/eslint-utils-2.1.0.tgz" @@ -1672,12 +1690,12 @@ "resolved" "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-2.1.0.tgz?cache=0&sync_timestamp=1636378395014&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-2.1.0.tgz" "version" "2.1.0" -"eslint-visitor-keys@^3.0.0": - "integrity" "sha512-yWJFpu4DtjsWKkt5GeNBBuZMlNcYVs6vRCLoCVEJrTjaSB6LC98gFipNK/erM2Heg/E8mIK+hXG/pJMLK+eRZA==" - "resolved" "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-3.1.0.tgz?cache=0&sync_timestamp=1636378395014&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-3.1.0.tgz" - "version" "3.1.0" +"eslint-visitor-keys@^3.0.0", "eslint-visitor-keys@^3.3.0", "eslint-visitor-keys@^3.4.1": + "integrity" "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==" + "resolved" "https://registry.npmmirror.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz" + "version" "3.4.3" -"eslint@*", "eslint@^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8", "eslint@^6.0.0 || ^7.0.0 || ^8.0.0", "eslint@^6.2.0 || ^7.0.0 || ^8.0.0", "eslint@^7.0.0", "eslint@^7.12.1", "eslint@^7.26.0", "eslint@^7.30.0", "eslint@>=4.19.1", "eslint@>=5", "eslint@>=5.0.0", "eslint@>=5.16.0": +"eslint@*", "eslint@^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8", "eslint@^6.0.0 || ^7.0.0 || ^8.0.0", "eslint@^6.2.0 || ^7.0.0 || ^8.0.0", "eslint@^7.0.0", "eslint@^7.12.1", "eslint@^7.26.0", "eslint@^7.30.0", "eslint@>=4.19.1", "eslint@>=5", "eslint@>=5.0.0", "eslint@>=5.16.0", "eslint@>=6.0.0": "integrity" "sha512-VHZ8gX+EDfz+97jGcgyGCyRia/dPOd6Xh9yPv8Bl1+SoaIwD+a/vlrOmGRUyOYu7MwUhc7CxqeaDZU13S4+EpA==" "resolved" "https://registry.npmmirror.com/eslint/download/eslint-7.32.0.tgz" "version" "7.32.0" @@ -1724,8 +1742,8 @@ "v8-compile-cache" "^2.0.3" "espree@^6.2.1": - "integrity" "sha1-d/xy4f10SiBSwg84pbV1gy6Cc0o=" - "resolved" "https://registry.npmmirror.com/espree/download/espree-6.2.1.tgz" + "integrity" "sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==" + "resolved" "https://registry.npmmirror.com/espree/-/espree-6.2.1.tgz" "version" "6.2.1" dependencies: "acorn" "^7.1.1" @@ -1741,6 +1759,15 @@ "acorn-jsx" "^5.3.1" "eslint-visitor-keys" "^1.3.0" +"espree@^9.3.1": + "integrity" "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==" + "resolved" "https://registry.npmmirror.com/espree/-/espree-9.6.1.tgz" + "version" "9.6.1" + dependencies: + "acorn" "^8.9.0" + "acorn-jsx" "^5.3.2" + "eslint-visitor-keys" "^3.4.1" + "esprima@^4.0.0": "integrity" "sha1-E7BM2z5sXRnfkatph6hpVhmwqnE=" "resolved" "https://registry.nlark.com/esprima/download/esprima-4.0.1.tgz" @@ -3356,10 +3383,10 @@ "resolved" "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz" "version" "6.3.0" -"semver@^7.2.1", "semver@^7.3.5": - "integrity" "sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=" - "resolved" "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz" - "version" "7.3.5" +"semver@^7.2.1", "semver@^7.3.5", "semver@^7.3.6": + "integrity" "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==" + "resolved" "https://registry.npmmirror.com/semver/-/semver-7.5.4.tgz" + "version" "7.5.4" dependencies: "lru-cache" "^6.0.0" @@ -3997,8 +4024,8 @@ "version" "1.7.4" "vue-eslint-parser@^7.10.0": - "integrity" "sha1-IUtd6pYQB/z/su5luJEjB2KNDa8=" - "resolved" "https://registry.npmmirror.com/vue-eslint-parser/download/vue-eslint-parser-7.11.0.tgz" + "integrity" "sha512-qh3VhDLeh773wjgNTl7ss0VejY9bMMa0GoDG2fQVyDzRFdiU3L7fw74tWZDHNQXdZqxO3EveQroa9ct39D2nqg==" + "resolved" "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz" "version" "7.11.0" dependencies: "debug" "^4.1.1" @@ -4009,6 +4036,19 @@ "lodash" "^4.17.21" "semver" "^6.3.0" +"vue-eslint-parser@^9.3.1": + "integrity" "sha512-Clr85iD2XFZ3lJ52/ppmUDG/spxQu6+MAeHXjjyI4I1NUYZ9xmenQp4N0oaHJhrA8OOxltCVxMRfANGa70vU0g==" + "resolved" "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-9.3.1.tgz" + "version" "9.3.1" + dependencies: + "debug" "^4.3.4" + "eslint-scope" "^7.1.1" + "eslint-visitor-keys" "^3.3.0" + "espree" "^9.3.1" + "esquery" "^1.4.0" + "lodash" "^4.17.21" + "semver" "^7.3.6" + "vue-i18n@^9.1.6": "integrity" "sha512-JeRdNVxS2OGp1E+pye5XB6+M6BBkHwAv9C80Q7+kzoMdUDGRna06tjC0vCB/jDX9aWrl5swxOMFcyAr7or8XTA==" "resolved" "https://registry.npmmirror.com/vue-i18n/download/vue-i18n-9.1.9.tgz"