ArcGIS API for JavaScript 4.x之绘制荧光线

本篇主要介绍基于ArcGIS API for JavaScript实现荧光线的效果，用到的数据来源于Echarts社区。最终运行效果图下图所示：

实现的思路：

其实很简单，这里我们将图形Graphic划分成了三层：其中最底层的图形符号线宽最大、颜色透明度最小；以此类推线宽减小一半，透明度增加，最上层符号颜色设置为白色，透明度为0.5。

下面的代码为本篇中使用的symbol样式，实际开发中可根据需求适当调整颜色、线宽参数：

var symbols = [
    {
        type: "simple-line",
        color: [50, 122, 183, 0.5],
        width: 3
    },
    {
        type: "simple-line",
        color: [50, 122, 200, 0.8],
        width: 1.5
    },
    {
        type: "simple-line",
        color: [255, 255, 255, 0.5],
        width: 0.75
    },
];

注意：在添加图形时要按照符号定义的顺序依次添加图形到图层：

for(let i = 0; i < country.coordinates.length; i++){
    let line = new Polyline({
        paths: country.coordinates[i],
        spatialReference: { wkid: 4326 }
    });
    for(let j = 0; j < symbols.length; j++){
        let graphic = new Graphic({
            geometry: line,
            symbol: symbols[j]
        });
        layer.add(graphic);
    }
}

数据链接：

示例数据地址