You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
59 lines
1.4 KiB
59 lines
1.4 KiB
<template>
|
|
<div :id="container"></div>
|
|
</template>
|
|
|
|
<script>
|
|
/**
|
|
* 高德地图组件
|
|
*/
|
|
|
|
import AMapLoader from '@amap/amap-jsapi-loader';
|
|
|
|
export default {
|
|
name: 'amap',
|
|
data() {
|
|
return {
|
|
container: 'container',
|
|
gisScript: 'gis-script',
|
|
key: '3b5479d9ad9f01d138fef5e70daed7bd',
|
|
v: '2.0',
|
|
map: undefined,
|
|
zoom: 10 // 默认缩放级别
|
|
|
|
}
|
|
},
|
|
created() {
|
|
},
|
|
mounted() {
|
|
this.amapInit()
|
|
},
|
|
methods: {
|
|
amapInit() {
|
|
AMapLoader.load({
|
|
key: this.key, // 申请好的Web端开发者Key，首次调用 load 时必填
|
|
version: this.v, // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
|
|
plugins: [], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
|
|
AMapUI: { // 是否加载 AMapUI，缺省不加载
|
|
version: '1.1', // AMapUI 缺省 1.1
|
|
plugins:[], // 需要加载的 AMapUI ui插件
|
|
},
|
|
Loca:{ // 是否加载 Loca， 缺省不加载
|
|
version: '2.0' // Loca 版本，缺省 1.3.2
|
|
},
|
|
}).then((AMap)=>{
|
|
const map = new AMap.Map(this.container, {
|
|
zoom: this.zoom,
|
|
mapStyle: "amap://styles/darkblue"
|
|
});
|
|
this.$emit('ready', map, this)
|
|
}).catch(e => {
|
|
console.log(e);
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|
|
|