api插件
parent
4215b805ed
commit
4680f6838e
|
@ -73,7 +73,7 @@ service.interceptors.request.use(config => {
|
|||
|
||||
// 响应拦截器
|
||||
service.interceptors.response.use(res => {
|
||||
debugger
|
||||
|
||||
// 未设置状态码则默认成功状态
|
||||
const code = res.data.code || 200;
|
||||
// 获取错误信息
|
||||
|
|
|
@ -0,0 +1,94 @@
|
|||
<template>
|
||||
<div class="dashboard-container">
|
||||
<div class="dashboard-text">name: {{ name }}</div>
|
||||
<button @click="drawPolygon">绘制多边形</button>
|
||||
<div id="container"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
import AMapLoader from "@amap/amap-jsapi-loader";
|
||||
|
||||
export default {
|
||||
name: 'Dashboard',
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'name'
|
||||
])
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
map: null,
|
||||
mouseTool: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initAMap()
|
||||
},
|
||||
unmounted() {
|
||||
this.map?.destroy()
|
||||
},
|
||||
methods: {
|
||||
initAMap() {
|
||||
AMapLoader.load({
|
||||
key: "865e9fd83bea2a4a2bb19ad5877365c3", // 申请好的Web端开发者Key,首次调用 load 时必填
|
||||
version: "2.0", // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
|
||||
plugins: ["AMap.MouseTool"], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
||||
})
|
||||
.then((AMap) => {
|
||||
this.map = new AMap.Map("container", {
|
||||
// 设置地图容器id
|
||||
viewMode: "3D", // 是否为3D地图模式
|
||||
zoom: 11, // 初始化地图级别
|
||||
center: [114.02919, 30.58203], // 初始化地图中心点位置
|
||||
});
|
||||
this.mouseTool = new AMap.MouseTool(this.map)
|
||||
this.mouseTool.on('draw', this.drawPolygonComplete)
|
||||
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
});
|
||||
},
|
||||
drawPolygon() {
|
||||
this.mouseTool.polygon({
|
||||
strokeColor: "#FF33FF",
|
||||
strokeOpacity: 1,
|
||||
strokeWeight: 6,
|
||||
strokeOpacity: 0.2,
|
||||
fillColor: '#1791fc',
|
||||
fillOpacity: 0.4,
|
||||
// 线样式还支持 'dashed'
|
||||
strokeStyle: "solid",
|
||||
// strokeStyle是dashed时有效
|
||||
// strokeDasharray: [30,10],
|
||||
})
|
||||
},
|
||||
drawPolygonComplete(event) {
|
||||
console.log(event)
|
||||
console.log(event.obj)
|
||||
console.log(event.obj.getPath())
|
||||
console.log('覆盖物对象绘制完成')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dashboard {
|
||||
&-container {
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
&-text {
|
||||
font-size: 30px;
|
||||
line-height: 46px;
|
||||
}
|
||||
}
|
||||
|
||||
#container {
|
||||
width: 100%;
|
||||
height: 800px;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue