在 index.html 中引入
<script src="https://webapi.amap.com/maps?v=1.4.15&key=秘钥"></script>
在 vue.config.js 中 添加
configureWebpack: config => {
config.externals = {
AMap: "window.AMap",
}
}
在 ***.vue 中
<div id="container" class="container"></div>
<script>
import AMap from "AMap";
export default {
created() {
setTimeout(function() {
const map = new AMap.Map("container");
const layer = new Loca.LineLayer({
eventSupport: true,
map: map
});
layer.on("mousemove", function(ev) {
console.log("Click target: ", ev.target);
console.log("Event type: ", ev.type);
console.log("Raw Event: ", ev.originalEvent);
console.log("Raw data: ", ev.rawData);
console.log("LngLat: ", ev.lnglat);
});
let citys = [
{
lnglat: ["116.3648,39.9993", "120.3647,59.8593"],
name: "哈哈哈"
}
];
layer.setData(citys, {
lnglat: "lnglat"
});
layer.setOptions({
style: {
color: "#4FC2FF",
opacity: 0.9,
lineWidth: 20
}
});
layer.render();
});
}
};
</script>
