首先我们要知道tint的原理是什么:
是颜色通道相加,黑色的颜色加任何颜色都是黑色,所以不生效
所以,我们可以先设置线段颜色为红色(你最终想要修改的颜色),然后把线段tint修改为黑色(加黑色就变成了黑),在这基础上再修改为你想要的颜色
例子:点击线段,实现线段由黑变红
const graphics = new PIXI.Graphics();
graphics.lineStyle(3000, 0xFF0000)
graphics.tint = 0x000000; // 重新设置颜色通道
graphics.moveTo(5000, 5000);
graphics.lineTo(10000, 5000);
graphics.interactive = true;
graphics.buttonMode = true; // 鼠标箭头变成小手
graphics.hitArea = new PIXI.Rectangle(5000, 5000, 5000, 3000); // 设置碰撞区域
graphics.on('click', () => {
graphics.tint = 0xFF0000;
});
container.addChild(graphics);