首页 > Windows开发 > 详细

vue中使用esri-loader加载Arcgisapi for js 4.x版本显示地图的简单demo

时间:2021-05-21 12:24:55      阅读:15      评论:0      收藏:0      [点我收藏+]
4的版本和3的版本差异在于:
(1)3的版本中之需要引入一个map创建一个map对象即可,4的版本必须要一个MapView来配合map才能正常显示效果
(2)用loadModules加载esri/Map,在4的版本中Map为大写,3为小写
 
在使用loadModules加载arcgisapi for js中的模块的时候如果不传入第二个option参数则会去官网找最新的js和css包,当然可以添加opetion参数让esload去自己指定的地址加载arcgisapi for js的包和css文件等。
<template>
  <div class="wrapper">
    <div id="map" class="map"></div>
  </div>
</template>
 
<script>
import esriLoader from "esri-loader";
export default {
  name: "",

 

  components: {},

 

  props: {},

 

  data() {
    return {};
  },

 

  created() {},

 

  mounted() {
    esriLoader.loadModules(["esri/Map","esri/views/MapView"]).then(([Map,MapView]) => {
      const map = new Map({
        basemap: "topo-vector",
      });

 

      const view = new MapView({
        container: "map",
        map: map,
        zoom: 4,
        center: [15, 65], 
      });
    });
  },

 

  computed: {},

 

  methods: {},
};
</script>
<style scoped>
.map {
  width: 100%;
  height: 100vh;
}
</style>

vue中使用esri-loader加载Arcgisapi for js 4.x版本显示地图的简单demo

原文:https://www.cnblogs.com/maycpou/p/14792857.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!