ArcGIS API for JavaScript 3.24 添加带箭头的线

最新推荐文章于 2022-07-18 14:47:30 发布

原创

最新推荐文章于 2022-07-18 14:47:30 发布 · 5.1k 阅读

1 ·

CC 4.0 BY-SA版权

本文作者作为一个GIS初学者，分享了如何使用ArcGIS API for JavaScript 3.24创建带有箭头的线条。通过画线、定位箭头点并调整角度，实现了自定义箭头位置和方向。在探索过程中，作者意外发现SimpleLineSymbol已有内置方法实现带箭头的线，但颜色设置存在限制，且美观度不足。

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

公司项目上有一个需求是要求显示一条有方向的线条

于是，机智的我想，带箭头的线不就是一条直线再加一个点么，把那个图片设置成图片就成了呀 (￣▽￣)~*（为自己感到机智）

说干就干，首先，先画一个线

var addLineSymbol = function(startPoint,endPoint,symbol,arrow){
    var polyLine = new DCI.esri.Polyline(
                    [[startPoint.longitude,startPoint.latitude],[endPoint.longitude,endPoint.latitude]]
                );
    var lineSymbol = new DCI.esri.SimpleLineSymbol({
            'color': symbol.color || {a:1,r:0,g:0,b:255},
            'width': symbol.width || 1,
        });
    var lineGraphic = new DCI.esri.Graphic(polyLine,lineSymbol);
    DCI.map.graphics.add(lineGraphic);
})

（若文中有看不懂的可以先看看增加一个标注点的分享 ArcGIS API for JavaScript 3.24 标注的添加和点击标注的回调事件）

然后再画一个点，可是点的位置在哪呢