代码来自：https://blog.csdn.net/weixin_34261415/article/details/91378280?utm_medium=distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromMachineLearnPai2~default-2.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromMachineLearnPai2~default-2.control
<template>
<div class="wrapper">
<div ref="map" class="map"></div>
</div>
</template>
<script>
import esriLoader from "esri-loader";
export default {
name: "",
components: {},
props: {},
data() {
return {};
},
created() {},
mounted() {
const options = { url: "https://js.arcgis.com/3.27/" };
esriLoader
.loadModules(
[
"esri/map"
],
options
)
.then(
([
Map
]) => {
let map = new Map(this.$refs.map, {
backgroundColor: "#eee",
basemap: ‘streets‘,
logo: false,
slider: false,
zoom: 7,
minZoom: 0
});
}
);
},
computed: {},
methods: {}
};
</script>
<style scoped>
@import url(‘https://js.arcgis.com/3.27/esri/css/esri.css‘);
.map {
width: 100%;
height: 100vh;
}
</style>