Arcgis js api二次开发——加载国家天地图

最新推荐文章于 2024-05-02 18:12:22 发布

niuge No.1

最新推荐文章于 2024-05-02 18:12:22 发布

阅读量753

点赞数

分类专栏： Esri 文章标签： javascript

本文链接：https://blog.csdn.net/niuge8905/article/details/125703958

版权

Esri 专栏收录该内容

18 篇文章 7 订阅

订阅专栏

<template>
  <div id="map-view"></div>
</template>

<script>
import SceneView from "@arcgis/core/views/SceneView";
import Map from "@arcgis/core/Map";
import WMTSLayer from "@arcgis/core/layers/WMTSLayer";
import Basemap from "@arcgis/core/Basemap";
export default {
  mounted() {
    this.init();
  },
  methods: {
    init() {
      const tk = ""; // 你申请的key
      const annaLayer = new WMTSLayer({
        url: "http://t0.tianditu.gov.cn/cva_c/wmts",
        customParameters: {
          tk: tk,
        },
      });
      const layer = new WMTSLayer({
        url: "http://t0.tianditu.gov.cn/img_c/wmts",
        customParameters: {
          tk: tk,
        },
      });

      let basemap = new Basemap({
        baseLayers: [layer,annaLayer],
      });
      const map = new Map({
        basemap: basemap
      });

      const view = new SceneView({
        container: "map-view",
        map: map,
      });
      console.log(view);
    },
  },
};
</script>
<style scoped>
#map-view {
  width: 800px;
  height: 800px;
}
</style>

如果想二维的，直接将SceneView改为MapView。效果图如下：