pixi.js - pixjs 图形颜色渗色问题

Question

我有两个函数使用相同的 Pixi 图形实例来绘制矩形。第一个函数只运行一次，用红色绘制 100 个矩形，另一个是一个重复函数，每 100 毫秒运行一次，并绘制一个白色矩形。当第一个函数执行一次时，第二个函数继续以红色绘制矩形，尽管指定了白色，如下例所示。谢谢您的帮助。

const canvas = document.getElementById('pixicanvas');
const pixiApp = new PIXI.Application({
  view: canvas,
  antialias: true,
  backgroundColor: 0x000000,
});
const pixiG = new PIXI.Graphics();
pixiApp.stage.addChild(pixiG);

setInterval(() => {
    pixiG.beginFill(0xffffff, 1);
    pixiG.drawRect(Math.random() * 500, Math.random() * 500, 10, 10);
    pixiG.endFill();
}, 100);

setTimeout(() => {
  //randomly plot 1000 rectanges
  pixiG.clear();
  [...new Array(100)].forEach((_) => {
    pixiG.beginFill(0xff0000, 1);
    pixiG.drawRect(Math.random() * 500, Math.random() * 500, 10, 10);
    pixiG.endFill();
  });
}, 5 * 1000);

canvas {
  width: 100vw;
  height: 100vh;
  border: 1px solid black;
}

<canvas id="pixicanvas"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/6.0.2/browser/pixi.min.js"></script>

标签： pixi.js