ArcGIS Api for javaScript 4.6 实现一个简单的地图渲染

最新推荐文章于 2024-05-13 20:41:04 发布

原创最新推荐文章于 2024-05-13 20:41:04 发布 · 3k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#ArcGIS API for JavaScript #地图加载

ArcGIS API for JavaScript 专栏收录该内容

8 篇文章

订阅专栏

这篇博客由gis初学者撰写，旨在以简单易懂的方式介绍如何使用ArcGIS API for JavaScript 4.6进行地图渲染。作者分享了学习过程中的经验，并欢迎读者指出可能存在的错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

说明：本人是一个gis小白，由于网上的资料过于专业，当时学习的时候经常看不懂，于是写了一些简单的关于ArcGIS Api for javaScript分享，若该分享中出现错误，希望大家指出，若能帮助到各位，不胜荣幸。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>地图</title>
    <style>
        html, body, #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>
    <link rel="stylesheet" href="https://js.arcgis.com/4.6/esri/css/main.css">
    <script src="https://js.arcgis.com/4.6/"></script>

    <script>
        require([
            "esri/layers/MapImageLayer",
                "esri/Map",
                "esri/views/MapView",
                "dojo/domReady!"],
            function(
                MapImageLayer,
                Map,
                MapView,
            ){
            //创建图层
            var layer = new MapImageLayer({
                url: "http://192.168.2.36:6080/arcgis/rest/services//vecMap/MapServer" //将该地址替换为本地的地图服务
            });
            //创建地图
            var map = new Map({
                layers: [layer]
            });
            //创建地图容器
            var view = new MapView({
                container: "viewDiv",
                map: map,
                center: [113.5, 23.1]
            });
        });
    </script>
</head>

<body>
    <div id="viewDiv"></div>
</body>

</html>

ArcGIS中功能实在太多，需要慢慢学习，上文实现了一个最简单单纯的地图加载，后续操作都将在这个基础上实现。