如何更改 PIXI.js 中的行上限？

Question

我正在尝试使用 PIXI.js 在 Graphics 对象上绘制一条圆角线。我使用 moveTo() 和 lineTo() 命令来画线，但这会导致它出现对接角（尖角、方形）。他们的文档说你可以使用 lineStyle() 方法并向它传递一个对象，在那里你可以指定 cap 并将其设置为来自名为 PIXI.LINE_CAP 的枚举的三个值之一。我试过这个：

myGraphics.lineStyle({
    cap: PIXI.LINE_CAP.ROUND
});

我被告知 LINE_CAP 未定义。我从这个 link https://cdnjs.cloudflare.com/ajax/libs/pixi.js/5.1.3/pixi.min.js 导入 PIXI.js，如果我在该文件上执行 ctrl + F，“LINE_CAP”不会出现在任何地方。

我是否需要导入库的另一部分才能访问此枚举？我为 drawTorus() 方法导入了 graphics-extra 文件，但里面也没有 LINE_CAP。我还打印了我的图形对象的 _lineStyle 属性，但那里似乎没有任何 lineCap 或 cap 属性？（他们也不是 lineWidth 或类似的东西）

此外，这可能无关紧要，但我似乎无法使用 lineStyle() 方法做任何事情，甚至无法更改线条的颜色或宽度。整个概念是否已被弃用或者他们只是没有更新他们的文档？如果是这样，我应该如何绘制圆角线？

到目前为止，我一直使用 arc() 方法在末尾放置一个圆帽，效果很好，但我在使用它时遇到了性能问题，我宁愿尽可能避免使用它. （如果我手动放置圆弧，那么 JavaScript 必须进行计算，而我假设更改线帽可以利用 WebGL 来显着加快渲染速度）

Here 是文档谈到这个枚举的地方。也许如果有办法找到这些枚举值中包含的值，我可以直接使用这些值而不是依赖枚举？

Answer 1

看来 LINE_CAP 是在 PIXI v5.3.0 或前后添加的。您使用的版本 (v5.1.3) 于 2019 年 9 月发布，因此建议更新到较新的版本（希望 5.1 和 5.3 之间没有太多（如果有的话）重大更改）。

如何更改 PIXI.js 中的行上限？

How to change the line cap in PIXI.js?

javascript

html

pixi.js