web-component-gallery 1.2.13 → 1.2.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/amap.umd.js +1 -1
- package/dist/index.umd.js +1 -1
- package/method/AMap.js +10 -0
- package/package.json +1 -1
- package/plugins/method/AMap.js +10 -0
package/dist/amap.umd.js
CHANGED
|
@@ -9033,7 +9033,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
9033
9033
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
9034
9034
|
|
|
9035
9035
|
"use strict";
|
|
9036
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */ getAMapInstance: () => (/* binding */ getAMapInstance),\n/* harmony export */ setAMapSecurity: () => (/* binding */ setAMapSecurity)\n/* harmony export */ });\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core-js/modules/es.array.push.js */ \"./node_modules/core-js/modules/es.array.push.js\");\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! core-js/modules/es.iterator.constructor.js */ \"./node_modules/core-js/modules/es.iterator.constructor.js\");\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core-js/modules/es.iterator.for-each.js */ \"./node_modules/core-js/modules/es.iterator.for-each.js\");\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! core-js/modules/es.iterator.map.js */ \"./node_modules/core-js/modules/es.iterator.map.js\");\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @amap/amap-jsapi-loader */ \"./node_modules/@amap/amap-jsapi-loader/dist/index.js\");\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__);\n\n\n\n\n// amap-plugin.js\n\nlet AMapKey = null;\nlet AMapStyle = null;\nlet AMapInstance = null;\n/** 默认地图key、样式及安全解码 */\nlet AMapConfig = {\n key: '722d07dd44d442d72a25a1304bac7743',\n style: 'amap://styles/ff26c7ed32880397f692f5b69b1c1f9f',\n securityJsCode: '90366326a87f1d0e3ddb43e05cc021b1'\n};\n\n// 安全配置 / 地图样式配置\nconst setAMapSecurity = (config = AMapConfig) => {\n const {\n key,\n style,\n securityJsCode\n } = config;\n AMapKey = key;\n AMapStyle = style;\n /** 设置高德地图密钥 */\n window.forceWebGL = true;\n window._AMapSecurityConfig = {\n securityJsCode\n };\n};\n\n// 核心地图服务类\nclass AMapService {\n constructor(AMap) {\n this.AMap = AMap;\n this._iconCache = new Map(); // 图标缓存\n\n /** 常用覆盖物 */\n this.layers = {\n setIcon: this.setIcon.bind(this),\n setMarker: this.setMarker.bind(this),\n setInfoWindow: this._createInfoWindowHandler()\n };\n\n /** 抛出地图常用方法 */\n this.methods = {\n getMapAddress: this.getMapAddress.bind(this),\n getMapSearch: this.getMapSearch.bind(this),\n setMapDriving: this.setMapDriving.bind(this),\n drawMapAnimation,\n parseRouteToPath,\n getOverlayPos\n };\n }\n\n /** 初始化地图 */\n initMap(container, options = {}) {\n const map = new this.AMap.Map(container, {\n zoom: 13,\n zooms: [3, 20],\n pitch: 30,\n rotation: -15,\n viewMode: '3D',\n mapStyle: AMapStyle,\n ...options\n });\n options.zoomTool && map.addControl(new this.AMap.ToolBar());\n options.directionTool && map.addControl(new this.AMap.ControlBar());\n return map;\n }\n\n /** 格式化地图经纬度 */\n setLngLat(position) {\n return new this.AMap.LngLat(position[0], position[1]);\n }\n\n /** 创建信息窗口处理器(柯里化函数) */\n _createInfoWindowHandler() {\n return Vue => {\n if (!Vue || !Vue.extend) {\n throw new Error('必须传入有效的Vue构造函数');\n }\n return ({\n component,\n props,\n options = {}\n }) => {\n if (!component) throw new Error('component参数必填');\n const InfoWindowComponent = Vue.extend(component);\n const instance = new InfoWindowComponent({\n propsData: props\n }).$mount(document.createElement('div'));\n return new this.AMap.InfoWindow({\n isCustom: true,\n content: instance.$el,\n ...options\n });\n };\n };\n }\n\n /** 带缓存的图标创建方法 */\n async setIcon(iconUrl) {\n if (this._iconCache.has(iconUrl)) {\n return this._iconCache.get(iconUrl);\n }\n return new Promise((resolve, reject) => {\n const icon = new this.AMap.Icon({\n image: iconUrl,\n imageOffset: new this.AMap.Pixel(0, 0)\n });\n const img = new Image();\n img.onload = () => {\n const size = new this.AMap.Size(img.width, img.height);\n icon.setSize(size);\n icon.setImageSize(size);\n this._iconCache.set(iconUrl, icon);\n resolve(icon);\n };\n img.onerror = () => reject(new Error(`图标加载失败: ${iconUrl}`));\n img.src = iconUrl;\n });\n }\n\n /** 增强的标记点创建方法 */\n async setMarker(iconUrl, options = {}) {\n try {\n const icon = await this.setIcon(iconUrl);\n const marker = new this.AMap.Marker({\n anchor: 'bottom-center',\n ...options,\n icon\n });\n return marker;\n } catch (error) {\n console.error('创建标记点失败:', error);\n throw error;\n }\n }\n\n /** 地图逆地理编码 */\n getMapAddress({\n longitude,\n latitude\n }, callBack) {\n return new Promise((resolve, reject) => {\n const geocoder = new this.AMap.Geocoder({\n city: '全国',\n extensions: 'all'\n });\n geocoder.getAddress([longitude, latitude], (status, result) => {\n if (status === 'complete' && result.info === 'OK') {\n const {\n formattedAddress,\n pois\n } = result.regeocode;\n const {\n district,\n township\n } = result.regeocode.addressComponent;\n const division = township && formattedAddress.includes(township) ? formattedAddress.indexOf(township) + township.length : formattedAddress.indexOf(district) + district.length;\n const addressMsg = {\n address: formattedAddress.slice(0, division) + (pois[0]?.address || ''),\n addressInfo: result.regeocode.addressComponent\n };\n callBack?.(addressMsg);\n resolve(addressMsg);\n } else {\n reject(new Error('转换失败'));\n }\n });\n });\n }\n\n /** 根据地址搜索地图poi点及其他信息 */\n /**\r\n * \r\n * @param {*} keywords 根据关键字搜索\r\n * @param {*} callBack 查询成功后过滤信息及转换格式 传递回调函数 兼容老版本代码\r\n */\n getMapSearch(keywords, callBack) {\n return new Promise(resolve => {\n const placeSearch = new this.AMap.PlaceSearch();\n placeSearch.search(keywords, (status, searchList) => {\n const options = searchList?.poiList?.pois?.map(node => ({\n ...node,\n label: `${node.name}(${node.address})`\n })) || [];\n callBack?.(options);\n resolve(options);\n });\n });\n }\n\n /** 道路规划 */\n /**\r\n * \r\n * @param {*} AMapInit 当前地图实例\r\n * @param {*} paths 需查询的路径起始点及途径点集合\r\n * @param {*} roadOptions 路线规划的其他参数\r\n * { paths: 需查询的路径起始点及途径点集合, options: 为查询路线配置项 }\r\n * @param {*} callBack 查询成功后回调函数 兼容老版本代码\r\n */\n async setMapDriving(mapInstance, roadOptions, callBack) {\n const {\n paths,\n options = {}\n } = roadOptions;\n return new Promise(resolve => {\n mapInstance.plugin(\"AMap.Driving\", () => {\n const driving = new this.AMap.Driving({\n map: mapInstance,\n ...options\n });\n driving.search(this.setLngLat(paths[0]), this.setLngLat(paths[paths.length - 1]), {\n waypoints: paths.slice(1, -1).map(path => this.setLngLat(path))\n }, (status, {\n routes\n }) => status === 'complete' && (callBack?.(roadDriving, routes), resolve({\n driving,\n routes\n })));\n });\n });\n }\n\n // 其他方法保持类似改造...\n}\n\n// 获取AMap实例(组件内使用)\nconst getAMapInstance = async (options = {}) => {\n if (AMapInstance) return AMapInstance;\n try {\n const AMap = await _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default().load({\n key: AMapKey,\n version: '2.0',\n plugins: ['AMap.Geocoder', 'AMap.PlaceSearch',\n // 搜索\n 'AMap.MouseTool',\n // 鼠标\n 'AMap.ControlBar',\n // 方向盘\n 'AMap.ToolBar',\n // 缩放\n ...(options.plugins || [])]\n });\n AMapInstance = new AMapService(AMap);\n return AMapInstance;\n } catch (e) {\n throw new Error(`高德地图加载失败: ${e.message}`);\n }\n};\n\n// 在 Vue 插件中封装高德地图的初始化和常用方法 \n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({\n async install(Vue, options = {}) {\n const amap = await getAMapInstance(options);\n const {\n AMap,\n methods,\n layers\n } = amap;\n Vue.prototype.$amap = AMap;\n\n /** 初始化地图 */\n Vue.prototype.$initAMap = (mapOptions, callBack) => {\n const amapInit = amap.initMap(mapOptions.el, mapOptions.options || {});\n /** 兼容之前版本代码 */\n callBack?.(amapInit);\n return amapInit;\n };\n\n /** 地图加载完成 */\n Vue.prototype.$amapBus.$emit('onAMapMounted');\n\n /** 常用覆盖物 */\n Vue.prototype.$amapLayers = {\n ...layers,\n setInfoWindow: layers.setInfoWindow(Vue)\n };\n\n /** 抛出地图常用方法 */\n Vue.prototype.$amapMethods = methods || {};\n }\n});\n\n/** \r\n * 安全获取覆盖物坐标信息 \r\n * @param {AMap.Overlay} overlay 地图覆盖物实例\r\n * @returns {Array<Array<number>>} 坐标点数组\r\n */\nfunction getOverlayPos(overlay) {\n if (!overlay) throw new Error('覆盖物实例不存在');\n try {\n return overlay.type === 'AMap.Marker' ? [overlay.getPosition().lng, overlay.getPosition().lat] : overlay.getPath().map(({\n lng,\n lat\n }) => [lng, lat]);\n } catch (e) {\n console.error('转换失败', e);\n return [];\n }\n}\n\n/**\r\n * 轨迹动画执行器\r\n * @param {AMap.Map} AMapInit 地图实例\r\n * @param {AMap.Marker} animationMarker 动画标记物\r\n * @param {Array<Array<number>>} paths 路径坐标数组\r\n * @param {Object} [options] 动画配置\r\n * @param {Function} [callBack] 动画完成回调\r\n */\nfunction drawMapAnimation(AMapInit, animationMarker, paths, options = {}, callBack) {\n if (!AMapInit || !animationMarker || !paths?.length) {\n return console.error('缺少参数信息');\n }\n AMapInit.plugin('AMap.MoveAnimation', () => {\n const defaultOptions = {\n duration: 500,\n autoRotation: true,\n ...options\n };\n animationMarker.moveAlong(paths, defaultOptions);\n callBack?.(animationMarker);\n });\n}\n\n/**\r\n * 转换导航路线为可绘制路径\r\n * @param {AMap.DrivingRoute} route 导航路线对象\r\n * @returns {{\r\n* path: Array<Array<number>>,\r\n* approachPoints: Array<number>\r\n* }}\r\n*/\nfunction parseRouteToPath(route) {\n if (!route?.steps) return {\n path: [],\n approachPoints: []\n };\n const result = {\n path: [],\n approachPoints: []\n };\n route.steps.forEach((step, stepIndex) => {\n step.path.forEach((point, pointIndex) => {\n result.path.push([point.lng, point.lat]);\n if (step.assistant_action === \"到达途经地\" && pointIndex === step.path.length - 1) {\n result.approachPoints.push(result.path.length - 1);\n }\n });\n });\n return result;\n}\n\n//# sourceURL=webpack://mui/./plugins/method/AMap.js?");
|
|
9036
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */ getAMapInstance: () => (/* binding */ getAMapInstance),\n/* harmony export */ setAMapSecurity: () => (/* binding */ setAMapSecurity)\n/* harmony export */ });\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core-js/modules/es.array.push.js */ \"./node_modules/core-js/modules/es.array.push.js\");\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! core-js/modules/es.iterator.constructor.js */ \"./node_modules/core-js/modules/es.iterator.constructor.js\");\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core-js/modules/es.iterator.for-each.js */ \"./node_modules/core-js/modules/es.iterator.for-each.js\");\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! core-js/modules/es.iterator.map.js */ \"./node_modules/core-js/modules/es.iterator.map.js\");\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @amap/amap-jsapi-loader */ \"./node_modules/@amap/amap-jsapi-loader/dist/index.js\");\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__);\n\n\n\n\n// amap-plugin.js\n\n\n/** 入口文件不同 作用域不同 */\nlet AMapKey = null;\nlet AMapStyle = null;\nlet AMapInstance = null;\n/** 默认地图key、样式及安全解码 */\nlet AMapConfig = {\n key: '722d07dd44d442d72a25a1304bac7743',\n style: 'amap://styles/ff26c7ed32880397f692f5b69b1c1f9f',\n securityJsCode: '90366326a87f1d0e3ddb43e05cc021b1'\n};\n\n// 安全配置 / 地图样式配置\nconst setAMapSecurity = (config = AMapConfig) => {\n const {\n key,\n style,\n securityJsCode\n } = config;\n AMapKey = key;\n AMapStyle = style;\n /** 设置高德地图密钥 */\n window.forceWebGL = true;\n window._AMapSecurityConfig = {\n securityJsCode\n };\n};\n\n// 核心地图服务类\nclass AMapService {\n constructor(AMap) {\n this.AMap = AMap;\n this._iconCache = new Map(); // 图标缓存\n\n /** 常用覆盖物 */\n this.layers = {\n setIcon: this.setIcon.bind(this),\n setMarker: this.setMarker.bind(this),\n setInfoWindow: this._createInfoWindowHandler()\n };\n\n /** 抛出地图常用方法 */\n this.methods = {\n getMapAddress: this.getMapAddress.bind(this),\n getMapSearch: this.getMapSearch.bind(this),\n setMapDriving: this.setMapDriving.bind(this),\n drawMapAnimation,\n parseRouteToPath,\n getOverlayPos\n };\n }\n\n /** 初始化地图 */\n initMap(container, options = {}) {\n const map = new this.AMap.Map(container, {\n zoom: 13,\n zooms: [3, 20],\n pitch: 30,\n rotation: -15,\n viewMode: '3D',\n mapStyle: AMapStyle,\n ...options\n });\n options.zoomTool && map.addControl(new this.AMap.ToolBar());\n options.directionTool && map.addControl(new this.AMap.ControlBar());\n return map;\n }\n\n /** 格式化地图经纬度 */\n setLngLat(position) {\n return new this.AMap.LngLat(position[0], position[1]);\n }\n\n /** 创建信息窗口处理器(柯里化函数) */\n _createInfoWindowHandler() {\n return Vue => {\n if (!Vue || !Vue.extend) {\n throw new Error('必须传入有效的Vue构造函数');\n }\n return ({\n component,\n props,\n options = {}\n }) => {\n if (!component) throw new Error('component参数必填');\n const InfoWindowComponent = Vue.extend(component);\n const instance = new InfoWindowComponent({\n propsData: props\n }).$mount(document.createElement('div'));\n return new this.AMap.InfoWindow({\n isCustom: true,\n content: instance.$el,\n ...options\n });\n };\n };\n }\n\n /** 带缓存的图标创建方法 */\n async setIcon(iconUrl) {\n if (this._iconCache.has(iconUrl)) {\n return this._iconCache.get(iconUrl);\n }\n return new Promise((resolve, reject) => {\n const icon = new this.AMap.Icon({\n image: iconUrl,\n imageOffset: new this.AMap.Pixel(0, 0)\n });\n const img = new Image();\n img.onload = () => {\n const size = new this.AMap.Size(img.width, img.height);\n icon.setSize(size);\n icon.setImageSize(size);\n this._iconCache.set(iconUrl, icon);\n resolve(icon);\n };\n img.onerror = () => reject(new Error(`图标加载失败: ${iconUrl}`));\n img.src = iconUrl;\n });\n }\n\n /** 增强的标记点创建方法 */\n async setMarker(iconUrl, options = {}) {\n try {\n const icon = await this.setIcon(iconUrl);\n const marker = new this.AMap.Marker({\n anchor: 'bottom-center',\n ...options,\n icon\n });\n return marker;\n } catch (error) {\n console.error('创建标记点失败:', error);\n throw error;\n }\n }\n\n /** 地图逆地理编码 */\n getMapAddress({\n longitude,\n latitude\n }, callBack) {\n return new Promise((resolve, reject) => {\n const geocoder = new this.AMap.Geocoder({\n city: '全国',\n extensions: 'all'\n });\n geocoder.getAddress([longitude, latitude], (status, result) => {\n if (status === 'complete' && result.info === 'OK') {\n const {\n formattedAddress,\n pois\n } = result.regeocode;\n const {\n district,\n township\n } = result.regeocode.addressComponent;\n const division = township && formattedAddress.includes(township) ? formattedAddress.indexOf(township) + township.length : formattedAddress.indexOf(district) + district.length;\n const addressMsg = {\n address: formattedAddress.slice(0, division) + (pois[0]?.address || ''),\n addressInfo: result.regeocode.addressComponent\n };\n callBack?.(addressMsg);\n resolve(addressMsg);\n } else {\n reject(new Error('转换失败'));\n }\n });\n });\n }\n\n /** 根据地址搜索地图poi点及其他信息 */\n /**\r\n * \r\n * @param {*} keywords 根据关键字搜索\r\n * @param {*} callBack 查询成功后过滤信息及转换格式 传递回调函数 兼容老版本代码\r\n */\n getMapSearch(keywords, callBack) {\n return new Promise(resolve => {\n const placeSearch = new this.AMap.PlaceSearch();\n placeSearch.search(keywords, (status, searchList) => {\n const options = searchList?.poiList?.pois?.map(node => ({\n ...node,\n label: `${node.name}(${node.address})`\n })) || [];\n callBack?.(options);\n resolve(options);\n });\n });\n }\n\n /** 道路规划 */\n /**\r\n * \r\n * @param {*} AMapInit 当前地图实例\r\n * @param {*} paths 需查询的路径起始点及途径点集合\r\n * @param {*} roadOptions 路线规划的其他参数\r\n * { paths: 需查询的路径起始点及途径点集合, options: 为查询路线配置项 }\r\n * @param {*} callBack 查询成功后回调函数 兼容老版本代码\r\n */\n async setMapDriving(mapInstance, roadOptions, callBack) {\n const {\n paths,\n options = {}\n } = roadOptions;\n return new Promise(resolve => {\n mapInstance.plugin(\"AMap.Driving\", () => {\n const driving = new this.AMap.Driving({\n map: mapInstance,\n ...options\n });\n driving.search(this.setLngLat(paths[0]), this.setLngLat(paths[paths.length - 1]), {\n waypoints: paths.slice(1, -1).map(path => this.setLngLat(path))\n }, (status, {\n routes\n }) => status === 'complete' && (callBack?.(roadDriving, routes), resolve({\n driving,\n routes\n })));\n });\n });\n }\n\n // 其他方法保持类似改造...\n}\n\n// 获取AMap实例(组件内使用)\nconst getAMapInstance = async (options = {}) => {\n if (AMapInstance) return AMapInstance;\n\n // 确保key存在\n if (!AMapKey) {\n try {\n setAMapSecurity();\n } catch (e) {\n throw new Error('请先设置地图Key!');\n }\n }\n try {\n const AMap = await _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default().load({\n key: AMapKey,\n version: '2.0',\n plugins: ['AMap.Geocoder', 'AMap.PlaceSearch',\n // 搜索\n 'AMap.MouseTool',\n // 鼠标\n 'AMap.ControlBar',\n // 方向盘\n 'AMap.ToolBar',\n // 缩放\n ...(options.plugins || [])]\n });\n AMapInstance = new AMapService(AMap);\n return AMapInstance;\n } catch (e) {\n throw new Error(`高德地图加载失败: ${e.message}`);\n }\n};\n\n// 在 Vue 插件中封装高德地图的初始化和常用方法 \n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({\n async install(Vue, options = {}) {\n const amap = await getAMapInstance(options);\n const {\n AMap,\n methods,\n layers\n } = amap;\n Vue.prototype.$amap = AMap;\n\n /** 初始化地图 */\n Vue.prototype.$initAMap = (mapOptions, callBack) => {\n const amapInit = amap.initMap(mapOptions.el, mapOptions.options || {});\n /** 兼容之前版本代码 */\n callBack?.(amapInit);\n return amapInit;\n };\n\n /** 地图加载完成 */\n Vue.prototype.$amapBus.$emit('onAMapMounted');\n\n /** 常用覆盖物 */\n Vue.prototype.$amapLayers = {\n ...layers,\n setInfoWindow: layers.setInfoWindow(Vue)\n };\n\n /** 抛出地图常用方法 */\n Vue.prototype.$amapMethods = methods || {};\n }\n});\n\n/** \r\n * 安全获取覆盖物坐标信息 \r\n * @param {AMap.Overlay} overlay 地图覆盖物实例\r\n * @returns {Array<Array<number>>} 坐标点数组\r\n */\nfunction getOverlayPos(overlay) {\n if (!overlay) throw new Error('覆盖物实例不存在');\n try {\n return overlay.type === 'AMap.Marker' ? [overlay.getPosition().lng, overlay.getPosition().lat] : overlay.getPath().map(({\n lng,\n lat\n }) => [lng, lat]);\n } catch (e) {\n console.error('转换失败', e);\n return [];\n }\n}\n\n/**\r\n * 轨迹动画执行器\r\n * @param {AMap.Map} AMapInit 地图实例\r\n * @param {AMap.Marker} animationMarker 动画标记物\r\n * @param {Array<Array<number>>} paths 路径坐标数组\r\n * @param {Object} [options] 动画配置\r\n * @param {Function} [callBack] 动画完成回调\r\n */\nfunction drawMapAnimation(AMapInit, animationMarker, paths, options = {}, callBack) {\n if (!AMapInit || !animationMarker || !paths?.length) {\n return console.error('缺少参数信息');\n }\n AMapInit.plugin('AMap.MoveAnimation', () => {\n const defaultOptions = {\n duration: 500,\n autoRotation: true,\n ...options\n };\n animationMarker.moveAlong(paths, defaultOptions);\n callBack?.(animationMarker);\n });\n}\n\n/**\r\n * 转换导航路线为可绘制路径\r\n * @param {AMap.DrivingRoute} route 导航路线对象\r\n * @returns {{\r\n* path: Array<Array<number>>,\r\n* approachPoints: Array<number>\r\n* }}\r\n*/\nfunction parseRouteToPath(route) {\n if (!route?.steps) return {\n path: [],\n approachPoints: []\n };\n const result = {\n path: [],\n approachPoints: []\n };\n route.steps.forEach((step, stepIndex) => {\n step.path.forEach((point, pointIndex) => {\n result.path.push([point.lng, point.lat]);\n if (step.assistant_action === \"到达途经地\" && pointIndex === step.path.length - 1) {\n result.approachPoints.push(result.path.length - 1);\n }\n });\n });\n return result;\n}\n\n//# sourceURL=webpack://mui/./plugins/method/AMap.js?");
|
|
9037
9037
|
|
|
9038
9038
|
/***/ }),
|
|
9039
9039
|
|
package/dist/index.umd.js
CHANGED
|
@@ -9033,7 +9033,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
9033
9033
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
9034
9034
|
|
|
9035
9035
|
"use strict";
|
|
9036
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */ getAMapInstance: () => (/* binding */ getAMapInstance),\n/* harmony export */ setAMapSecurity: () => (/* binding */ setAMapSecurity)\n/* harmony export */ });\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core-js/modules/es.array.push.js */ \"./node_modules/core-js/modules/es.array.push.js\");\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! core-js/modules/es.iterator.constructor.js */ \"./node_modules/core-js/modules/es.iterator.constructor.js\");\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core-js/modules/es.iterator.for-each.js */ \"./node_modules/core-js/modules/es.iterator.for-each.js\");\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! core-js/modules/es.iterator.map.js */ \"./node_modules/core-js/modules/es.iterator.map.js\");\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @amap/amap-jsapi-loader */ \"./node_modules/@amap/amap-jsapi-loader/dist/index.js\");\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__);\n\n\n\n\n// amap-plugin.js\n\nlet AMapKey = null;\nlet AMapStyle = null;\nlet AMapInstance = null;\n/** 默认地图key、样式及安全解码 */\nlet AMapConfig = {\n key: '722d07dd44d442d72a25a1304bac7743',\n style: 'amap://styles/ff26c7ed32880397f692f5b69b1c1f9f',\n securityJsCode: '90366326a87f1d0e3ddb43e05cc021b1'\n};\n\n// 安全配置 / 地图样式配置\nconst setAMapSecurity = (config = AMapConfig) => {\n const {\n key,\n style,\n securityJsCode\n } = config;\n AMapKey = key;\n AMapStyle = style;\n /** 设置高德地图密钥 */\n window.forceWebGL = true;\n window._AMapSecurityConfig = {\n securityJsCode\n };\n};\n\n// 核心地图服务类\nclass AMapService {\n constructor(AMap) {\n this.AMap = AMap;\n this._iconCache = new Map(); // 图标缓存\n\n /** 常用覆盖物 */\n this.layers = {\n setIcon: this.setIcon.bind(this),\n setMarker: this.setMarker.bind(this),\n setInfoWindow: this._createInfoWindowHandler()\n };\n\n /** 抛出地图常用方法 */\n this.methods = {\n getMapAddress: this.getMapAddress.bind(this),\n getMapSearch: this.getMapSearch.bind(this),\n setMapDriving: this.setMapDriving.bind(this),\n drawMapAnimation,\n parseRouteToPath,\n getOverlayPos\n };\n }\n\n /** 初始化地图 */\n initMap(container, options = {}) {\n const map = new this.AMap.Map(container, {\n zoom: 13,\n zooms: [3, 20],\n pitch: 30,\n rotation: -15,\n viewMode: '3D',\n mapStyle: AMapStyle,\n ...options\n });\n options.zoomTool && map.addControl(new this.AMap.ToolBar());\n options.directionTool && map.addControl(new this.AMap.ControlBar());\n return map;\n }\n\n /** 格式化地图经纬度 */\n setLngLat(position) {\n return new this.AMap.LngLat(position[0], position[1]);\n }\n\n /** 创建信息窗口处理器(柯里化函数) */\n _createInfoWindowHandler() {\n return Vue => {\n if (!Vue || !Vue.extend) {\n throw new Error('必须传入有效的Vue构造函数');\n }\n return ({\n component,\n props,\n options = {}\n }) => {\n if (!component) throw new Error('component参数必填');\n const InfoWindowComponent = Vue.extend(component);\n const instance = new InfoWindowComponent({\n propsData: props\n }).$mount(document.createElement('div'));\n return new this.AMap.InfoWindow({\n isCustom: true,\n content: instance.$el,\n ...options\n });\n };\n };\n }\n\n /** 带缓存的图标创建方法 */\n async setIcon(iconUrl) {\n if (this._iconCache.has(iconUrl)) {\n return this._iconCache.get(iconUrl);\n }\n return new Promise((resolve, reject) => {\n const icon = new this.AMap.Icon({\n image: iconUrl,\n imageOffset: new this.AMap.Pixel(0, 0)\n });\n const img = new Image();\n img.onload = () => {\n const size = new this.AMap.Size(img.width, img.height);\n icon.setSize(size);\n icon.setImageSize(size);\n this._iconCache.set(iconUrl, icon);\n resolve(icon);\n };\n img.onerror = () => reject(new Error(`图标加载失败: ${iconUrl}`));\n img.src = iconUrl;\n });\n }\n\n /** 增强的标记点创建方法 */\n async setMarker(iconUrl, options = {}) {\n try {\n const icon = await this.setIcon(iconUrl);\n const marker = new this.AMap.Marker({\n anchor: 'bottom-center',\n ...options,\n icon\n });\n return marker;\n } catch (error) {\n console.error('创建标记点失败:', error);\n throw error;\n }\n }\n\n /** 地图逆地理编码 */\n getMapAddress({\n longitude,\n latitude\n }, callBack) {\n return new Promise((resolve, reject) => {\n const geocoder = new this.AMap.Geocoder({\n city: '全国',\n extensions: 'all'\n });\n geocoder.getAddress([longitude, latitude], (status, result) => {\n if (status === 'complete' && result.info === 'OK') {\n const {\n formattedAddress,\n pois\n } = result.regeocode;\n const {\n district,\n township\n } = result.regeocode.addressComponent;\n const division = township && formattedAddress.includes(township) ? formattedAddress.indexOf(township) + township.length : formattedAddress.indexOf(district) + district.length;\n const addressMsg = {\n address: formattedAddress.slice(0, division) + (pois[0]?.address || ''),\n addressInfo: result.regeocode.addressComponent\n };\n callBack?.(addressMsg);\n resolve(addressMsg);\n } else {\n reject(new Error('转换失败'));\n }\n });\n });\n }\n\n /** 根据地址搜索地图poi点及其他信息 */\n /**\r\n * \r\n * @param {*} keywords 根据关键字搜索\r\n * @param {*} callBack 查询成功后过滤信息及转换格式 传递回调函数 兼容老版本代码\r\n */\n getMapSearch(keywords, callBack) {\n return new Promise(resolve => {\n const placeSearch = new this.AMap.PlaceSearch();\n placeSearch.search(keywords, (status, searchList) => {\n const options = searchList?.poiList?.pois?.map(node => ({\n ...node,\n label: `${node.name}(${node.address})`\n })) || [];\n callBack?.(options);\n resolve(options);\n });\n });\n }\n\n /** 道路规划 */\n /**\r\n * \r\n * @param {*} AMapInit 当前地图实例\r\n * @param {*} paths 需查询的路径起始点及途径点集合\r\n * @param {*} roadOptions 路线规划的其他参数\r\n * { paths: 需查询的路径起始点及途径点集合, options: 为查询路线配置项 }\r\n * @param {*} callBack 查询成功后回调函数 兼容老版本代码\r\n */\n async setMapDriving(mapInstance, roadOptions, callBack) {\n const {\n paths,\n options = {}\n } = roadOptions;\n return new Promise(resolve => {\n mapInstance.plugin(\"AMap.Driving\", () => {\n const driving = new this.AMap.Driving({\n map: mapInstance,\n ...options\n });\n driving.search(this.setLngLat(paths[0]), this.setLngLat(paths[paths.length - 1]), {\n waypoints: paths.slice(1, -1).map(path => this.setLngLat(path))\n }, (status, {\n routes\n }) => status === 'complete' && (callBack?.(roadDriving, routes), resolve({\n driving,\n routes\n })));\n });\n });\n }\n\n // 其他方法保持类似改造...\n}\n\n// 获取AMap实例(组件内使用)\nconst getAMapInstance = async (options = {}) => {\n if (AMapInstance) return AMapInstance;\n try {\n const AMap = await _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default().load({\n key: AMapKey,\n version: '2.0',\n plugins: ['AMap.Geocoder', 'AMap.PlaceSearch',\n // 搜索\n 'AMap.MouseTool',\n // 鼠标\n 'AMap.ControlBar',\n // 方向盘\n 'AMap.ToolBar',\n // 缩放\n ...(options.plugins || [])]\n });\n AMapInstance = new AMapService(AMap);\n return AMapInstance;\n } catch (e) {\n throw new Error(`高德地图加载失败: ${e.message}`);\n }\n};\n\n// 在 Vue 插件中封装高德地图的初始化和常用方法 \n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({\n async install(Vue, options = {}) {\n const amap = await getAMapInstance(options);\n const {\n AMap,\n methods,\n layers\n } = amap;\n Vue.prototype.$amap = AMap;\n\n /** 初始化地图 */\n Vue.prototype.$initAMap = (mapOptions, callBack) => {\n const amapInit = amap.initMap(mapOptions.el, mapOptions.options || {});\n /** 兼容之前版本代码 */\n callBack?.(amapInit);\n return amapInit;\n };\n\n /** 地图加载完成 */\n Vue.prototype.$amapBus.$emit('onAMapMounted');\n\n /** 常用覆盖物 */\n Vue.prototype.$amapLayers = {\n ...layers,\n setInfoWindow: layers.setInfoWindow(Vue)\n };\n\n /** 抛出地图常用方法 */\n Vue.prototype.$amapMethods = methods || {};\n }\n});\n\n/** \r\n * 安全获取覆盖物坐标信息 \r\n * @param {AMap.Overlay} overlay 地图覆盖物实例\r\n * @returns {Array<Array<number>>} 坐标点数组\r\n */\nfunction getOverlayPos(overlay) {\n if (!overlay) throw new Error('覆盖物实例不存在');\n try {\n return overlay.type === 'AMap.Marker' ? [overlay.getPosition().lng, overlay.getPosition().lat] : overlay.getPath().map(({\n lng,\n lat\n }) => [lng, lat]);\n } catch (e) {\n console.error('转换失败', e);\n return [];\n }\n}\n\n/**\r\n * 轨迹动画执行器\r\n * @param {AMap.Map} AMapInit 地图实例\r\n * @param {AMap.Marker} animationMarker 动画标记物\r\n * @param {Array<Array<number>>} paths 路径坐标数组\r\n * @param {Object} [options] 动画配置\r\n * @param {Function} [callBack] 动画完成回调\r\n */\nfunction drawMapAnimation(AMapInit, animationMarker, paths, options = {}, callBack) {\n if (!AMapInit || !animationMarker || !paths?.length) {\n return console.error('缺少参数信息');\n }\n AMapInit.plugin('AMap.MoveAnimation', () => {\n const defaultOptions = {\n duration: 500,\n autoRotation: true,\n ...options\n };\n animationMarker.moveAlong(paths, defaultOptions);\n callBack?.(animationMarker);\n });\n}\n\n/**\r\n * 转换导航路线为可绘制路径\r\n * @param {AMap.DrivingRoute} route 导航路线对象\r\n * @returns {{\r\n* path: Array<Array<number>>,\r\n* approachPoints: Array<number>\r\n* }}\r\n*/\nfunction parseRouteToPath(route) {\n if (!route?.steps) return {\n path: [],\n approachPoints: []\n };\n const result = {\n path: [],\n approachPoints: []\n };\n route.steps.forEach((step, stepIndex) => {\n step.path.forEach((point, pointIndex) => {\n result.path.push([point.lng, point.lat]);\n if (step.assistant_action === \"到达途经地\" && pointIndex === step.path.length - 1) {\n result.approachPoints.push(result.path.length - 1);\n }\n });\n });\n return result;\n}\n\n//# sourceURL=webpack://mui/./plugins/method/AMap.js?");
|
|
9036
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */ getAMapInstance: () => (/* binding */ getAMapInstance),\n/* harmony export */ setAMapSecurity: () => (/* binding */ setAMapSecurity)\n/* harmony export */ });\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core-js/modules/es.array.push.js */ \"./node_modules/core-js/modules/es.array.push.js\");\n/* harmony import */ var core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_array_push_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! core-js/modules/es.iterator.constructor.js */ \"./node_modules/core-js/modules/es.iterator.constructor.js\");\n/* harmony import */ var core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_constructor_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core-js/modules/es.iterator.for-each.js */ \"./node_modules/core-js/modules/es.iterator.for-each.js\");\n/* harmony import */ var core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_for_each_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! core-js/modules/es.iterator.map.js */ \"./node_modules/core-js/modules/es.iterator.map.js\");\n/* harmony import */ var core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(core_js_modules_es_iterator_map_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @amap/amap-jsapi-loader */ \"./node_modules/@amap/amap-jsapi-loader/dist/index.js\");\n/* harmony import */ var _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4__);\n\n\n\n\n// amap-plugin.js\n\n\n/** 入口文件不同 作用域不同 */\nlet AMapKey = null;\nlet AMapStyle = null;\nlet AMapInstance = null;\n/** 默认地图key、样式及安全解码 */\nlet AMapConfig = {\n key: '722d07dd44d442d72a25a1304bac7743',\n style: 'amap://styles/ff26c7ed32880397f692f5b69b1c1f9f',\n securityJsCode: '90366326a87f1d0e3ddb43e05cc021b1'\n};\n\n// 安全配置 / 地图样式配置\nconst setAMapSecurity = (config = AMapConfig) => {\n const {\n key,\n style,\n securityJsCode\n } = config;\n AMapKey = key;\n AMapStyle = style;\n /** 设置高德地图密钥 */\n window.forceWebGL = true;\n window._AMapSecurityConfig = {\n securityJsCode\n };\n};\n\n// 核心地图服务类\nclass AMapService {\n constructor(AMap) {\n this.AMap = AMap;\n this._iconCache = new Map(); // 图标缓存\n\n /** 常用覆盖物 */\n this.layers = {\n setIcon: this.setIcon.bind(this),\n setMarker: this.setMarker.bind(this),\n setInfoWindow: this._createInfoWindowHandler()\n };\n\n /** 抛出地图常用方法 */\n this.methods = {\n getMapAddress: this.getMapAddress.bind(this),\n getMapSearch: this.getMapSearch.bind(this),\n setMapDriving: this.setMapDriving.bind(this),\n drawMapAnimation,\n parseRouteToPath,\n getOverlayPos\n };\n }\n\n /** 初始化地图 */\n initMap(container, options = {}) {\n const map = new this.AMap.Map(container, {\n zoom: 13,\n zooms: [3, 20],\n pitch: 30,\n rotation: -15,\n viewMode: '3D',\n mapStyle: AMapStyle,\n ...options\n });\n options.zoomTool && map.addControl(new this.AMap.ToolBar());\n options.directionTool && map.addControl(new this.AMap.ControlBar());\n return map;\n }\n\n /** 格式化地图经纬度 */\n setLngLat(position) {\n return new this.AMap.LngLat(position[0], position[1]);\n }\n\n /** 创建信息窗口处理器(柯里化函数) */\n _createInfoWindowHandler() {\n return Vue => {\n if (!Vue || !Vue.extend) {\n throw new Error('必须传入有效的Vue构造函数');\n }\n return ({\n component,\n props,\n options = {}\n }) => {\n if (!component) throw new Error('component参数必填');\n const InfoWindowComponent = Vue.extend(component);\n const instance = new InfoWindowComponent({\n propsData: props\n }).$mount(document.createElement('div'));\n return new this.AMap.InfoWindow({\n isCustom: true,\n content: instance.$el,\n ...options\n });\n };\n };\n }\n\n /** 带缓存的图标创建方法 */\n async setIcon(iconUrl) {\n if (this._iconCache.has(iconUrl)) {\n return this._iconCache.get(iconUrl);\n }\n return new Promise((resolve, reject) => {\n const icon = new this.AMap.Icon({\n image: iconUrl,\n imageOffset: new this.AMap.Pixel(0, 0)\n });\n const img = new Image();\n img.onload = () => {\n const size = new this.AMap.Size(img.width, img.height);\n icon.setSize(size);\n icon.setImageSize(size);\n this._iconCache.set(iconUrl, icon);\n resolve(icon);\n };\n img.onerror = () => reject(new Error(`图标加载失败: ${iconUrl}`));\n img.src = iconUrl;\n });\n }\n\n /** 增强的标记点创建方法 */\n async setMarker(iconUrl, options = {}) {\n try {\n const icon = await this.setIcon(iconUrl);\n const marker = new this.AMap.Marker({\n anchor: 'bottom-center',\n ...options,\n icon\n });\n return marker;\n } catch (error) {\n console.error('创建标记点失败:', error);\n throw error;\n }\n }\n\n /** 地图逆地理编码 */\n getMapAddress({\n longitude,\n latitude\n }, callBack) {\n return new Promise((resolve, reject) => {\n const geocoder = new this.AMap.Geocoder({\n city: '全国',\n extensions: 'all'\n });\n geocoder.getAddress([longitude, latitude], (status, result) => {\n if (status === 'complete' && result.info === 'OK') {\n const {\n formattedAddress,\n pois\n } = result.regeocode;\n const {\n district,\n township\n } = result.regeocode.addressComponent;\n const division = township && formattedAddress.includes(township) ? formattedAddress.indexOf(township) + township.length : formattedAddress.indexOf(district) + district.length;\n const addressMsg = {\n address: formattedAddress.slice(0, division) + (pois[0]?.address || ''),\n addressInfo: result.regeocode.addressComponent\n };\n callBack?.(addressMsg);\n resolve(addressMsg);\n } else {\n reject(new Error('转换失败'));\n }\n });\n });\n }\n\n /** 根据地址搜索地图poi点及其他信息 */\n /**\r\n * \r\n * @param {*} keywords 根据关键字搜索\r\n * @param {*} callBack 查询成功后过滤信息及转换格式 传递回调函数 兼容老版本代码\r\n */\n getMapSearch(keywords, callBack) {\n return new Promise(resolve => {\n const placeSearch = new this.AMap.PlaceSearch();\n placeSearch.search(keywords, (status, searchList) => {\n const options = searchList?.poiList?.pois?.map(node => ({\n ...node,\n label: `${node.name}(${node.address})`\n })) || [];\n callBack?.(options);\n resolve(options);\n });\n });\n }\n\n /** 道路规划 */\n /**\r\n * \r\n * @param {*} AMapInit 当前地图实例\r\n * @param {*} paths 需查询的路径起始点及途径点集合\r\n * @param {*} roadOptions 路线规划的其他参数\r\n * { paths: 需查询的路径起始点及途径点集合, options: 为查询路线配置项 }\r\n * @param {*} callBack 查询成功后回调函数 兼容老版本代码\r\n */\n async setMapDriving(mapInstance, roadOptions, callBack) {\n const {\n paths,\n options = {}\n } = roadOptions;\n return new Promise(resolve => {\n mapInstance.plugin(\"AMap.Driving\", () => {\n const driving = new this.AMap.Driving({\n map: mapInstance,\n ...options\n });\n driving.search(this.setLngLat(paths[0]), this.setLngLat(paths[paths.length - 1]), {\n waypoints: paths.slice(1, -1).map(path => this.setLngLat(path))\n }, (status, {\n routes\n }) => status === 'complete' && (callBack?.(roadDriving, routes), resolve({\n driving,\n routes\n })));\n });\n });\n }\n\n // 其他方法保持类似改造...\n}\n\n// 获取AMap实例(组件内使用)\nconst getAMapInstance = async (options = {}) => {\n if (AMapInstance) return AMapInstance;\n\n // 确保key存在\n if (!AMapKey) {\n try {\n setAMapSecurity();\n } catch (e) {\n throw new Error('请先设置地图Key!');\n }\n }\n try {\n const AMap = await _amap_amap_jsapi_loader__WEBPACK_IMPORTED_MODULE_4___default().load({\n key: AMapKey,\n version: '2.0',\n plugins: ['AMap.Geocoder', 'AMap.PlaceSearch',\n // 搜索\n 'AMap.MouseTool',\n // 鼠标\n 'AMap.ControlBar',\n // 方向盘\n 'AMap.ToolBar',\n // 缩放\n ...(options.plugins || [])]\n });\n AMapInstance = new AMapService(AMap);\n return AMapInstance;\n } catch (e) {\n throw new Error(`高德地图加载失败: ${e.message}`);\n }\n};\n\n// 在 Vue 插件中封装高德地图的初始化和常用方法 \n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({\n async install(Vue, options = {}) {\n const amap = await getAMapInstance(options);\n const {\n AMap,\n methods,\n layers\n } = amap;\n Vue.prototype.$amap = AMap;\n\n /** 初始化地图 */\n Vue.prototype.$initAMap = (mapOptions, callBack) => {\n const amapInit = amap.initMap(mapOptions.el, mapOptions.options || {});\n /** 兼容之前版本代码 */\n callBack?.(amapInit);\n return amapInit;\n };\n\n /** 地图加载完成 */\n Vue.prototype.$amapBus.$emit('onAMapMounted');\n\n /** 常用覆盖物 */\n Vue.prototype.$amapLayers = {\n ...layers,\n setInfoWindow: layers.setInfoWindow(Vue)\n };\n\n /** 抛出地图常用方法 */\n Vue.prototype.$amapMethods = methods || {};\n }\n});\n\n/** \r\n * 安全获取覆盖物坐标信息 \r\n * @param {AMap.Overlay} overlay 地图覆盖物实例\r\n * @returns {Array<Array<number>>} 坐标点数组\r\n */\nfunction getOverlayPos(overlay) {\n if (!overlay) throw new Error('覆盖物实例不存在');\n try {\n return overlay.type === 'AMap.Marker' ? [overlay.getPosition().lng, overlay.getPosition().lat] : overlay.getPath().map(({\n lng,\n lat\n }) => [lng, lat]);\n } catch (e) {\n console.error('转换失败', e);\n return [];\n }\n}\n\n/**\r\n * 轨迹动画执行器\r\n * @param {AMap.Map} AMapInit 地图实例\r\n * @param {AMap.Marker} animationMarker 动画标记物\r\n * @param {Array<Array<number>>} paths 路径坐标数组\r\n * @param {Object} [options] 动画配置\r\n * @param {Function} [callBack] 动画完成回调\r\n */\nfunction drawMapAnimation(AMapInit, animationMarker, paths, options = {}, callBack) {\n if (!AMapInit || !animationMarker || !paths?.length) {\n return console.error('缺少参数信息');\n }\n AMapInit.plugin('AMap.MoveAnimation', () => {\n const defaultOptions = {\n duration: 500,\n autoRotation: true,\n ...options\n };\n animationMarker.moveAlong(paths, defaultOptions);\n callBack?.(animationMarker);\n });\n}\n\n/**\r\n * 转换导航路线为可绘制路径\r\n * @param {AMap.DrivingRoute} route 导航路线对象\r\n * @returns {{\r\n* path: Array<Array<number>>,\r\n* approachPoints: Array<number>\r\n* }}\r\n*/\nfunction parseRouteToPath(route) {\n if (!route?.steps) return {\n path: [],\n approachPoints: []\n };\n const result = {\n path: [],\n approachPoints: []\n };\n route.steps.forEach((step, stepIndex) => {\n step.path.forEach((point, pointIndex) => {\n result.path.push([point.lng, point.lat]);\n if (step.assistant_action === \"到达途经地\" && pointIndex === step.path.length - 1) {\n result.approachPoints.push(result.path.length - 1);\n }\n });\n });\n return result;\n}\n\n//# sourceURL=webpack://mui/./plugins/method/AMap.js?");
|
|
9037
9037
|
|
|
9038
9038
|
/***/ }),
|
|
9039
9039
|
|
package/method/AMap.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// amap-plugin.js
|
|
2
2
|
import AMapLoader from '@amap/amap-jsapi-loader'
|
|
3
3
|
|
|
4
|
+
/** 入口文件不同 作用域不同 */
|
|
4
5
|
let AMapKey = null
|
|
5
6
|
let AMapStyle = null
|
|
6
7
|
let AMapInstance = null
|
|
@@ -225,6 +226,15 @@ class AMapService {
|
|
|
225
226
|
export const getAMapInstance = async (options = {}) => {
|
|
226
227
|
if (AMapInstance) return AMapInstance
|
|
227
228
|
|
|
229
|
+
// 确保key存在
|
|
230
|
+
if (!AMapKey) {
|
|
231
|
+
try {
|
|
232
|
+
setAMapSecurity()
|
|
233
|
+
} catch (e) {
|
|
234
|
+
throw new Error('请先设置地图Key!')
|
|
235
|
+
}
|
|
236
|
+
}
|
|
237
|
+
|
|
228
238
|
try {
|
|
229
239
|
const AMap = await AMapLoader.load({
|
|
230
240
|
key: AMapKey,
|
package/package.json
CHANGED
package/plugins/method/AMap.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// amap-plugin.js
|
|
2
2
|
import AMapLoader from '@amap/amap-jsapi-loader'
|
|
3
3
|
|
|
4
|
+
/** 入口文件不同 作用域不同 */
|
|
4
5
|
let AMapKey = null
|
|
5
6
|
let AMapStyle = null
|
|
6
7
|
let AMapInstance = null
|
|
@@ -225,6 +226,15 @@ class AMapService {
|
|
|
225
226
|
export const getAMapInstance = async (options = {}) => {
|
|
226
227
|
if (AMapInstance) return AMapInstance
|
|
227
228
|
|
|
229
|
+
// 确保key存在
|
|
230
|
+
if (!AMapKey) {
|
|
231
|
+
try {
|
|
232
|
+
setAMapSecurity()
|
|
233
|
+
} catch (e) {
|
|
234
|
+
throw new Error('请先设置地图Key!')
|
|
235
|
+
}
|
|
236
|
+
}
|
|
237
|
+
|
|
228
238
|
try {
|
|
229
239
|
const AMap = await AMapLoader.load({
|
|
230
240
|
key: AMapKey,
|