{"_id":"@baclt1580/vue-map-coord","name":"@baclt1580/vue-map-coord","dist-tags":{"latest":"1.1.5"},"versions":{"1.1.5":{"name":"@baclt1580/vue-map-coord","private":false,"author":{"name":"lizhi"},"version":"1.1.5","description":"对vue-map-coord的修改,实际上只是在初始化方法加了个reset","keywords":["vue","vue3","map","coordinate","point-selection","coordinate-choose","vue-map-coord","vue3-map-coord"],"scripts":{"test":"vite","build":"vue-tsc --noEmit && vite build","release":"node ./scripts/release.js"},"main":"./dist/coord-map.es.js","module":"./dist/coord-map.es.js","unpkg":"./dist/coord-map.umd.js","types":"./dist/types/index.d.ts","style":"dist/style.css","license":"MIT","repository":{"type":"git","url":"git+https://github.com/lizhi1255/vue-map-coord.git"},"dependencies":{"@amap/amap-jsapi-loader":"^1.0.1"},"devDependencies":{"@types/node":"^18.8.3","@vitejs/plugin-vue":"^3.1.0","ant-design-vue":"^3.2.12","chalk":"^4.0.0","enquirer":"^2.3.6","execa":"^5.0.0","less":"^4.1.3","semver":"^7.3.8","typescript":"^4.9.3","unplugin-vue-components":"^0.22.7","vite":"^3.1.0","vite-plugin-dts":"^1.6.6","vite-plugin-style-inject":"^0.0.1","vue":"^3.2.45","vue-tsc":"^1.0.9"},"peerDependencies":{"vue":">=3.0.0"},"bugs":{"url":"https://github.com/lizhi1255/vue-map-coord/issues"},"homepage":"https://github.com/lizhi1255/vue-map-coord#readme","_id":"@baclt1580/vue-map-coord@1.1.5","_nodeVersion":"16.14.0","_npmVersion":"8.3.1","dist":{"integrity":"sha512-+MwItHNnHl4HQWr8K7xJP2gGvAtW/F1KrxBQ2ubYl2w9uaC5rBlNZ9zFF6rNX47pNvkLxvTFulYYD8ALoKrtBA==","shasum":"5d8a0860d6b000195e57086acbb7793995131291","tarball":"https://registry.npmjs.org/@baclt1580/vue-map-coord/-/vue-map-coord-1.1.5.tgz","fileCount":3,"unpackedSize":6097,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHKR2pjsJ/46q1mswAur2ob/BmBpX5HCoMeyumPMJXDsAiBv9yj03pEBvSW1VEpoAwGCEl70gGLqCTjfR6X8+mdspA=="}]},"_npmUser":{"name":"baclt1580","email":"1580945628@qq.com"},"directories":{},"maintainers":[{"name":"baclt1580","email":"1580945628@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-map-coord_1.1.5_1683876088196_0.8300334973501406"},"_hasShrinkwrap":false}},"time":{"created":"2023-05-12T07:21:28.142Z","1.1.5":"2023-05-12T07:21:28.332Z","modified":"2023-05-12T07:21:28.499Z"},"maintainers":[{"name":"baclt1580","email":"1580945628@qq.com"}],"description":"对vue-map-coord的修改,实际上只是在初始化方法加了个reset","homepage":"https://github.com/lizhi1255/vue-map-coord#readme","keywords":["vue","vue3","map","coordinate","point-selection","coordinate-choose","vue-map-coord","vue3-map-coord"],"repository":{"type":"git","url":"git+https://github.com/lizhi1255/vue-map-coord.git"},"author":{"name":"lizhi"},"bugs":{"url":"https://github.com/lizhi1255/vue-map-coord/issues"},"license":"MIT","readme":"# vue-map-coord\n\n基于 vue3 和高德地图的坐标拾取工具，具有坐标查询，地址查询，坐标拾取等功能、\n\n## 效果展示\n\n![image](/example/images/example.gif)\n\n## 安装\n\n- `NPM`\n\n```shell\nnpm install vue-map-coord --save\n```\n\n- `Yarn`\n\n```shell\nyan add element-plus\n```\n\n- `browser`\n\n```html\n<script src=\"https://unpkg.com/browse/vue-map-coord/dist/coord-map.umd.js\"></script>\n```\n\n## 组件配置\n\n### 属性\n\n- `mapKey`\n\n  > 高德地图 key\n\n  ```js\n  // 类型\n  type: string;\n  // 是否必选\n  required: true;\n  ```\n\n- `position`\n\n  > 默认经纬度坐标\n\n  ```js\n  // 类型\n  type:string|number[]; //[lng,lat]\n  // 是否必选\n  required:false;\n  ```\n\n- `mapConfig`\n\n  > 地图组件配置项\n\n  ```js\n  // 类型\n  type:{\n      width?:string, //地图宽度\n      height?:string, //地图高度\n      center?:number[], //地图中心 如传入position属性 则默认以position为地图中心坐标\n      zoom?:number, //地图层级\n      satellite?:boolean, //是否开启卫星图\n  };\n  // 默认值\n  default:{\n      width:'100%',\n      height:'100%',\n      satellite:false,\n      zoom:10\n  };\n  // 是否必选\n  required:false;\n  ```\n\n### 事件\n\n- `onCoordChange`\n\n  > 当点位地址变化时触发的事件\n\n  ```js\n  // 回调参数\n  {\n      lng:string|number, //经度\n      lat:string|number, //纬度\n      position:string|number[], //经纬度数组[经度，纬度]\n      address:Address, //地址对象\n      formattedAddress:string //地址\n  };\n  // address类型\n  interface Address{\n      addressComponent: {\n          citycode:string,\n          adcode:string,\n          businessAreas:string[],\n          neighborhoodType:string,\n          neighborhood: string,\n          province: string,\n          street: string,\n          streetNumber: string,\n          township: string\n      },\n      crosses: string[],\n      formattedAddress: string,\n      pois: string[],\n      roads: string[]\n  };\n  ```\n\n### 方法\n\n- `resetMap`\n\n  > 重置地图状态\n\n  ```js\n  // 参数\n  posClear?:boolean //default:false 是否强行清除所有状态，如果组件传入position属性，默认不重置点位及地址数据\n  ```\n\n- `destroyMap`\n\n  > 重置并销毁地图\n\n## 注意项\n\n> 组件所在容器需设置高度，或者在配置项属性里设置组件的高度\n\n## 使用\n\n### 注册组件\n\n- 全局组件注册`install`\n\n```js\n// main.js\nimport { createApp } from \"vue\";\nimport App from \"./App.vue\";\nimport CoordMap from \"vue-map-coord\";\nconst app = createApp(App);\napp.use(CoordMap);\napp.mount(\"#app\");\n```\n\n- 单个.vue 文件局部注册\n\n```vue\n// Options API 方式\n<script>\nimport { CoordMap } from \"vue-map-coord\";\nexport default {\n  components: {\n    CoordMap,\n  },\n};\n</script>\n```\n\n```vue\n// Composition API 方式\n<script setup>\nimport { CoordMap } from \"vue-map-coord\";\n</script>\n```\n\n### 使用组件\n\n```vue\n<script setup>\nimport { ref, watchEffect } from \"vue\";\nimport { CoordMap,CoordChangeProps, CoordMapExpose } from \"vue-map-coord\";\n\nconst onCoordChange = (value: CoordChangeProps) => {\n  console.log(value);\n};\nconst position = ref([120.405985, 36.120701]);\nconst CoordMapRef = ref<CoordMapExpose>();\nwatchEffect(() => {\n  console.log(position.value);\n});\n</script>\n\n<template>\n  <div style=\"height:600px\">\n    <CoordMap\n      ref=\"CoordMapRef\"\n      mapKey=\"高德地图key\"\n      @onCoordChange=\"onCoordChange\"\n      v-model:position=\"position\"\n    />\n  </div>\n</template>\n```\n","readmeFilename":"README.md"}