ArcGIS JS api 4.15加载天地图（一）

最新推荐文章于 2023-03-09 11:40:55 发布

GISER皮

最新推荐文章于 2023-03-09 11:40:55 发布

阅读量3k

点赞数 1

分类专栏： GIS

本文链接：https://blog.csdn.net/gispipi/article/details/107320543

版权

1 下载与配置。进入下载页面 https://developers.arcgis.com/javascript/latest/guide/get-api/2.

摘要由CSDN通过智能技术生成

1 下载与配置。进入下载页面

https://developers.arcgis.com/javascript/latest/guide/get-api/
在这里插入图片描述

2.下载完成后，将js类库放到web程序资源文件。

在这里插入图片描述
修改init.js 和 dojo/dojo.js文件，搜索baseUrl，将baseUrl:"https://[HOSTNAME_AND_PATH_TO_JSAPI]dojo中的[HOSTNAME_AND_PATH_TO_JSAPI]改为自己web程序中的资源目录，最终如：http://localhost:8080/res/js/dojo（res为我的springboot项目配置的静态资源的路径）。
注：此处如果想像ArcGIS那样引用自定义类，可以在init.js中配置依赖路径（在packages数组中添加自定义的即可，比如{location:"../my",name:"my"} 完成自定义路径添加，my文件夹即dojo.js文件夹的上一级目录下的my文件夹）。在这里插入图片描述

3 页面加载一下为测试页面，天地图以山东为例。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>Intro to MapView - Create a 2D map</title>
    <style>
      html,
      body,
      #viewDiv {
   
        padding: 0;
        margin: 0;
        height: 100%;
        width: 100%;
      }
    </style>
    <link rel="stylesheet" 	href="/res/js/esri/themes/light/main.css" />
    <script type="text/javascript" src="/res/js/init.js"></script>
    <script>
      require(["esri/Map", 
      "esri/views/MapView",
      "esri/layers/BaseTileLayer",
      "esri/layers/support/TileInfo",
	  "esri/geometry/SpatialReference",
      "esri/geometry/Extent",
      "esri/config",
      "esri/request"], 
      function(Map, MapView,BaseTileLayer,TileInfo,SpatialReference,Extent,esriConfig, esriRequest) {
   

          var tileInfo = new TileInfo({
   
            "dpi": 96,
            "format": "image/png",
            "compressionQuality": 0,
            "spatialReference": new SpatialReference({
   
            "wkid": 4326
            }),
            "rows": 256,