套件
// npm 安裝 pixi-filters
npm install pixi-filters
寫法
import {ShockwaveFilter} from 'pixi-filters';
import {Sprite, Assets, Container, DisplacementFilter} from 'pixi.js';
// pixi.js v8.x addressMode set repeat 的用法
// 引入素材
const texture1 = await Assets.load("圖片路徑");
// texture 設定
texture1.source.addressMode = 'repeat';
const sprite = new Sprite(texture1);
const displacementFilter = new DisplacementFilter(sprite);
const shockwaveFilter = new ShockwaveFilter(
{
center: {
x: Math.random() * app.screen.width, // 隨機 x 點
y: Math.random() * app.screen.height, // 隨機 y 點
},
radius: 160, // 漣漪半徑
wavelength: 65,// 漣漪波長
amplitude: 100,// 漣漪震幅
speed: 300, // 漣漪速度
time:1, // 漣漪出現時間
brightness:5,
},
);