From 0fc59ce1f1ea9f6bd31b116425b7cd96ccf08b12 Mon Sep 17 00:00:00 2001 From: zhenyuWang <13641039885@163.com> Date: Tue, 2 Aug 2022 17:28:22 +0800 Subject: [PATCH] =?UTF-8?q?refactor(h5=20map):=20=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E6=98=AF=E5=90=A6=E9=AB=98=E5=BE=B7=E5=9C=B0=E5=9B=BE=E5=88=A4?= =?UTF-8?q?=E6=96=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/platforms/h5/helpers/location.js | 2 ++ .../h5/view/components/map/index.vue | 31 +++++++++---------- .../h5/view/components/map/map-marker.js | 21 +++++-------- .../h5/view/components/map/map-polygon.js | 9 ++---- .../h5/view/components/map/maps/callout.js | 13 +++----- .../h5/view/components/map/maps/index.js | 10 +++--- 6 files changed, 35 insertions(+), 51 deletions(-) diff --git a/src/platforms/h5/helpers/location.js b/src/platforms/h5/helpers/location.js index 2670ae0a1..51f77e9f6 100644 --- a/src/platforms/h5/helpers/location.js +++ b/src/platforms/h5/helpers/location.js @@ -36,3 +36,5 @@ export function getMapInfo () { key: '' } } + +export const IS_AMAP = getMapInfo().type === MapType.AMAP diff --git a/src/platforms/h5/view/components/map/index.vue b/src/platforms/h5/view/components/map/index.vue index 0a111eff9..479d80d04 100644 --- a/src/platforms/h5/view/components/map/index.vue +++ b/src/platforms/h5/view/components/map/index.vue @@ -48,10 +48,7 @@ import { import mapMarker from './map-marker' import mapPolygon from './map-polygon' -import { ICON_PATH_ORIGIN, MapType, getMapInfo } from '../../../helpers/location' - -const mapInfo = getMapInfo() -const ISAMAP = mapInfo.type === MapType.AMAP +import { ICON_PATH_ORIGIN, IS_AMAP } from '../../../helpers/location' function getAMapPosition (maps, latitude, longitude) { return new maps.LngLat(longitude, latitude) @@ -60,7 +57,7 @@ function getGoogleQQMapPosition (maps, latitude, longitude) { return new maps.LatLng(latitude, longitude) } function getMapPosition (maps, latitude, longitude) { - return ISAMAP ? getAMapPosition(maps, latitude, longitude) : getGoogleQQMapPosition(maps, latitude, longitude) + return IS_AMAP ? getAMapPosition(maps, latitude, longitude) : getGoogleQQMapPosition(maps, latitude, longitude) } function getLat (latLng) { @@ -231,7 +228,7 @@ export default { }, methods: { handleAMapClick (e) { - if (ISAMAP) { + if (IS_AMAP) { const { pageX, pageY } = e.changedTouches[0] this.$trigger('click', { x: pageX, y: pageY }, {}) this.$trigger('tap', { x: pageX, y: pageY }, {}) @@ -370,7 +367,7 @@ export default { } }) }) - if (ISAMAP) { + if (IS_AMAP) { this.isBoundsReady = true this.$emit('boundsready') } @@ -492,7 +489,7 @@ export default { const path = [] option.points.forEach(point => { - const pointPosition = ISAMAP ? [point.longitude, point.latitude] : getGoogleQQMapPosition(maps, point.latitude, point.longitude) + const pointPosition = IS_AMAP ? [point.longitude, point.latitude] : getGoogleQQMapPosition(maps, point.latitude, point.longitude) path.push(pointPosition) }) @@ -507,7 +504,7 @@ export default { strokeDashStyle: option.dottedLine ? 'dash' : 'solid' } - if (ISAMAP) { + if (IS_AMAP) { polylineOptions.strokeColor = option.strokeColor polylineOptions.strokeStyle = option.dottedLine ? 'dashed' : 'solid' polylineOptions.isOutline = !!option.borderWidth @@ -535,7 +532,7 @@ export default { polyline.push(new maps.Polyline(polylineBorderOptions)) } const _polyline = new maps.Polyline(polylineOptions) - if (ISAMAP) { + if (IS_AMAP) { map.add(_polyline) } polyline.push(_polyline) @@ -554,7 +551,7 @@ export default { const circles = this.circlesSync this.removeCircles() this.circles.forEach(option => { - const center = ISAMAP ? [option.longitude, option.latitude] : getGoogleQQMapPosition(maps, option.latitude, option.longitude) + const center = IS_AMAP ? [option.longitude, option.latitude] : getGoogleQQMapPosition(maps, option.latitude, option.longitude) const circleOptions = { map, center, @@ -564,7 +561,7 @@ export default { strokeDashStyle: 'solid' } - if (ISAMAP) { + if (IS_AMAP) { circleOptions.strokeColor = option.color circleOptions.fillColor = option.fillColor || '#000' } else { @@ -584,7 +581,7 @@ export default { } const circle = new maps.Circle(circleOptions) - if (ISAMAP) { + if (IS_AMAP) { map.add(circle) } circles.push(circle) @@ -636,7 +633,7 @@ export default { } $event.stopPropagation() } - if (ISAMAP) { + if (IS_AMAP) { this.$refs.mapContainer.appendChild(control) } else { map.controls[maps.ControlPosition.TOP_LEFT].push(control) @@ -665,7 +662,7 @@ export default { return } const position = getMapPosition(maps, res.latitude, res.longitude) - if (ISAMAP) { + if (IS_AMAP) { location = new maps.Marker({ position, map, @@ -736,7 +733,7 @@ export default { this.boundsReady(() => { const map = this._map - if (ISAMAP) { + if (IS_AMAP) { const _points = [] points.forEach(point => { _points.push([point.longitude, point.latitude]) @@ -759,7 +756,7 @@ export default { } }) - if (ISAMAP) { + if (IS_AMAP) { this.isBoundsReady = true this.$emit('boundsready') } diff --git a/src/platforms/h5/view/components/map/map-marker.js b/src/platforms/h5/view/components/map/map-marker.js index b99a7a86d..3d25ce520 100644 --- a/src/platforms/h5/view/components/map/map-marker.js +++ b/src/platforms/h5/view/components/map/map-marker.js @@ -1,12 +1,6 @@ -import { - MapType, - getMapInfo -} from '../../../helpers/location' +import { mapInfo, MapType, IS_AMAP } from '../../../helpers/location' import getRealPath from 'uni-platform/helpers/get-real-path' -const mapInfo = getMapInfo() -const ISAMAP = mapInfo.type === MapType.AMAP - export default { props: { id: { @@ -105,7 +99,7 @@ export default { maps.event.addListener(marker, 'click', (e) => { const callout = marker.callout if (callout && !callout.alwaysVisible) { - if (ISAMAP) { + if (IS_AMAP) { callout.visible = !callout.visible if (callout.visible) { marker.callout.createAMapText() @@ -140,7 +134,7 @@ export default { const maps = this._maps const marker = this._marker const title = option.title - const position = ISAMAP ? new maps.LngLat(option.longitude, option.latitude) : new maps.LatLng(option.latitude, option.longitude) + const position = IS_AMAP ? new maps.LngLat(option.longitude, option.latitude) : new maps.LatLng(option.latitude, option.longitude) const img = new Image() img.onload = () => { const anchor = option.anchor || {} @@ -216,8 +210,7 @@ export default { }) marker.label = label } else if ('setLabel' in marker) { - // 高德 - if (ISAMAP) { + if (IS_AMAP) { const content = `