Javascript Pixi.js缩放/不重新渲染精灵？

我正在学习pixi.js，打算用它来渲染一个有很多节点的大型有向图。我分叉了一个类似的代码笔，但当我对精灵使用简单的圆形纹理时，当我放大时，边缘变得模糊：

这是代码笔：

如何让pixi.js在新的缩放级别上重新栅格化圆，以便放大时圆的边缘清晰可见

我见过很多这样的例子，它们似乎是自动发生的（例如，这里：），所以我很困惑为什么它不能在上面的代码笔中工作

我见过很多这样的例子，它们似乎是自动发生的（例如，这里：），所以我很困惑为什么它不能在上面的代码笔中工作

它在那里工作，因为他们只绘制“图形”对象（没有纹理）：

“图形”总是正确地“缩放”，因为它们是在每次渲染时计算的（我认为）。但纹理只生成一次，然后重新使用

在您的代码中有哪些帮助：

• 制作更大的纹理，然后缩放由此创建的精灵

^见：

• 增加纹理的“分辨率”（“正在生成的纹理的分辨率/设备像素比”）：

您需要验证并决定使用哪种方法：）

function makeParicleTexture(props) {
  const gfx = new PIXI.Graphics();
  gfx.beginFill(props.fill);
  gfx.lineStyle(props.strokeWidth, props.stroke);
  gfx.drawCircle(props.size / 2, props.size / 2, 3)
  gfx.endFill();

  const texture = app.renderer.generateTexture(gfx, PIXI.SCALE_MODES.LINEAR, 2);
  return texture;
}

var graphics = new PIXI.Graphics();

graphics.beginFill(0xe74c3c); // Red
d3.range(numCircles).map(function() {
    graphics.drawCircle(randomX(), randomY(), 1);
});

stage.addChild(graphics);

gfx.drawCircle(props.size / 2, props.size / 2, 3)
// make radius bigger:
gfx.drawCircle(props.size / 2, props.size / 2, 30)

//then in "makeSprites" function add this line somewhere after Sprite is created:
sprite.scale.set(0.1, 0.1);

const texture = app.renderer.generateTexture(gfx, PIXI.SCALE_MODES.LINEAR, 2);
// change to:
const texture = app.renderer.generateTexture(gfx, PIXI.SCALE_MODES.LINEAR, 20);