arcgis js 4 使用pixi.js 构建道路发光闪烁线

我们来用pixi.js 构建发光的线，这个可以用于交通道路端的可视化

首先数据结构定义 其

let option = {

renderer: {

type: "simple",

symbol: {

lineColor: "#48ff9a",

lineWidth: 3,

filterColor: "#48ff9a",

filterStrength: 2,

filterSpeed: 1.5

}

},

data: [

{

geometry: [[12609052.185915885, 2656339.6069692653],

[12716675.521741385, 3593151.825632137]],

attributes: {

name: "广州-武汉",

}

},

{

geometry: [[12609052.185915885, 2656339.6069692653],

[11855688.835137373, 3458622.655850267]],

attributes: {

name: "广州-重庆",

}

},

{

geometry: [[12609052.185915885, 2656339.6069692653],

[13521404.55552746, 3666531.372785874]],

attributes: {

name: "广州-上海",

}

},

{

geometry: [[12609052.185915885, 2656339.6069692653],

[13785570.925280986, 1381981.4713991268]],

attributes: {

name: "广州-菲律宾",

}

}

]

};

我们通过一些全局变量保存一些信息

//创建列表存放线

this.graphics = [];

//获取动画速度

this.tweenTime = this.options.renderer.symbol.filterSpeed;

//发光滤镜

this.glowFilter = null;

线的坐标转换

```javascript

function pathToScreen(geometry) {

let arr = [];

for (let item of geometry) {

let newPoint = toScreen(item)

 更多参考 https://xiaozhuanlan.com/topic/5428170396