How to change the line cap in PIXI.js?

Question

I'm trying to draw a line with rounded corners onto a Graphics object with PIXI.js. I use the moveTo() and lineTo() commands to draw the line, but that causes it to come out with butt corners (pointy, square). Their documentation says you can use the lineStyle() method and pass it an object, and in there you can specify cap and set it to one of three values from an enum called PIXI.LINE_CAP. I tried this:

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

and I'm told that LINE_CAP is not defined. I import PIXI.js from this link https://cdnjs.cloudflare.com/ajax/libs/pixi.js/5.1.3/pixi.min.js, and if I do a ctrl + F on that file "LINE_CAP" does not appear anywhere.

Do I need to import another part of the library in order to access this enum? I import the graphics-extra file for the drawTorus() method anyway, and there is no LINE_CAP in there either. I also printed out the _lineStyle property of my graphics object and there doesn't even appear to be any lineCap or cap property there anyway? (Nor is their a lineWidth or anything similar)

Also, this may be unrelated, but I can't seem to get the lineStyle() method to do anything at all, not even to change the color or width of my lines. Was this entire concept deprecated or something and they just haven't updated their docs? If so, how should I go about drawing a line with rounded caps?

Up until now I've used the arc() method to put a round cap on the end, and it's worked fine, but I have performance concerns when using that and I'd rather avoid it if possible. (If I manually place the arc then JavaScript has to do the computations, whereas I assume changing the linecap can leverage WebGL to render significantly faster)

Here is where the documentation speaks of this enum. Perhaps if there is a way to find the values contained in these enum values I could just use those values directly instead of relying on the enum?

Answer 1

It seems that LINE_CAP was added in or around v5.3.0 of PIXI. The version you are using (v5.1.3) was released in September 2019, so it would be recommended to update to a newer version (hopefully there isn't many, if any, breaking changes between 5.1 and 5.3).