ArcGisJS实现地图常用工具条、距离测量和面积测量（非官方实例）

最新推荐文章于 2024-08-19 04:50:56 发布

神码浮云

最新推荐文章于 2024-08-19 04:50:56 发布

阅读量3.3k

点赞数

分类专栏： ArcGIS API for JavaScript 文章标签：地图工具距离测量面积测量

本文链接：https://blog.csdn.net/xiaocai0923/article/details/88130253

版权

本文介绍了如何使用ArcGIS JavaScript API实现地图的平移、缩放、全图显示，以及非官方实例的的距离测量和面积测量功能。测量功能未依赖官方组件，提供了源代码供参考，需要注意API的引用路径。如有需要，可联系作者获取源代码。

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

常用地图工具包括：平移、拉框缩小、拉框放大、全图、距离测量、面积测量、清除标记，距离测量、面积测量没有使用官方自带的组件代码。

1.距离测量

2.面积测量

3.源代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>测量工具 - 3.18</title>
    <meta charset="utf-8" />
    <link rel="Stylesheet" type="text/css" href="http://127.0.0.1/api/arcgis_js_api/library/3.18/3.18/esri/css/esri.css" />
    <script type="text/javascript">
        //下面这段代码必须放到下面几个脚本文件的上面，否则会错误
        var dojoConfig = {
            api_url: "127.0.0.1/api/arcgis_js_api/library/3.18/3.18",
            async : false,
            isDebug : true,
            parseOnLoad : true,
            mblHideAddressBar : false,
            packages : [{
                name: "lib",
                location: location.pathname.replace(/\/[^/]+$/, '') + '/lib'
            }]
        };
    </script>
    <script type="text/javascript" src="http://127.0.0.1/api/arcgis_js_api/library/3.18/3.18/init.js"></script>
    <style type="text/css">
        html, body {
            margin:0px;
            height:100%;
        }
        #map_canvas {
            width:100%;
            height:100%;
            margin:0px auto;
        }
        #map_tools {
            position: absolute;
            right: 10px;
            top:10px;
        }
    </style>
    <script type="text/javascript">
        var map;
        require([
            "esri/map",
            "esri/layers/ArcGISTiledMapServiceLayer",
            "esri/toolbars/navigation",
            "esri/toolbars/draw",
            "esri/tasks/GeometryService",
            "esri/symbols/Font",
            "esri/symbols/SimpleMarkerSymbol",
            "esri/symbols/SimpleLineSymbol",
            "esri/symbols/SimpleFillSymbol",
            "esri/symbols/TextSymbol",
            "esri/Color",
            "dojo/number",
            "esri/graphic",
            "esri/tasks/LengthsParameters",
            "esri/geometry/Point",
            "esri/geometry/Polyline",
            "esri/tasks/AreasAndLengthsParameters",
            "dojo/dom-attr",
            "dojo/domReady!"
        ], functio