I am trying to draw using pixi.js version 8.1.5 Graphics
:
const graphics = new Graphics()
graphics
.clear()
.moveTo(km.graphic.origin.x, km.graphic.origin.y)
.lineTo(km.graphic.center.x, km.graphic.center.y)
.stroke({ color: km.graphic.color, width: km.graphic.lineWidth })
.circle(km.graphic.center.x, km.graphic.center.y, km.graphic.radius)
.fill(km.graphic.color);
My problem is that both lines and boundary of circle are jagged:
antialias
is turned on:
const app = new Application();
await app.init({
backgroundAlpha: 0,
resizeTo: this.element,
antialias: true,
});
I also tried, per common internet advice, adding to init()
: autodensity: true
, resolution: window.devicePixelRatio
and resolution: 2
, with no change in result.
I cannot use graphics-smooth library, since it only supports pixi.js v7.
How can I achieve smoother lines and graphic boundaries?