arcgis js 4 使用pixi.js 构建喷泉粒子

我们来用pixi.js 来构建喷泉粒子

首先数据结构定义

• let option = {
• renderer: {
• type: "simple",
• symbol: {
• startColor: "#beffd1",
• endColor: "#91ffd7",
• maxLifetime: 0.35,
• maxParticles: 300
• }
• },
• data: [
• {
• geometry: [12697872.012783196, 2577456.5937789795],
• attributes: {
• name: "深圳"
• }
• },
• {
• geometry: [12956152.73135875, 4855356.473704897],
• attributes: {
• name: "北京"
• }
• },
• {
• geometry: [12127804.65583251, 4070118.8821315],
• attributes: {
• name: "西安"
• }
• }
•  
• ]
• };

我们使用pixi 粒子插件

• import {Emitter} from "pixi-particles";

喷泉的具体参数，由于参数过于复杂，我们抽选出简单的参数来配置
```javascript

this.configuration = {
"alpha": {
"start": 1,
"end": 0.3
},
"scale": {
"start": 0.5,
"end": 1
},
"color": {
"start": this.options.renderer.symbol.startColor,
"end": this.options.renderer.symbol.endColor
},
"speed": {
"start": 600,
"end": 200
},
"acceleration": {
"x": 0,
"y": 3000
},
"startRotation": {
"min": 260,
"max": 280
},
"rotationSpeed": {
"min": 0,
"max": 0
},
"lifetime": {
"min": 0.25,
"max": this.options.renderer.symbol.maxLifetime

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