Jump to content

problem on curve line


Recommended Posts

I am just using pixi to draw a curvepath
I use quadraticCurveTo or bezierCurveTo for this and everything is fine but when I use alphaFilter or increase the lineWidth it looks bad as shown below
Can you please guide me?
Thank you very much and I apologize for not being able to express my problem very well in English


Link to comment
Share on other sites

when I use alphaFilter

that turns off antialias, you have to use MSAA ( available in webgl2!) like for circle here: https://pixijs.io/examples/#/plugin-picture/blend-modes.js

alternative: use https://github.com/pixijs/graphics-smooth , it doesnt need antialias, it has huge-ass vertex shader

Edited by ivan.popelyshev
Link to comment
Share on other sites

            width: 5,
            color: 0x000000,
            join: 'round',
            cap:  'round'
          graphics.moveTo(p1.x, p1.y);
            let i;
            for (i = 1; i < points.length - 2; i++) {
                var xc = (points[i].x + points[i + 1].x) / 2;
                var yc = (points[i].y + points[i + 1].y) / 2;
                graphics.quadraticCurveTo(points[i].x, points[i].y, xc, yc);
            // curve through the last two points
            if (points[i] && points[i + 1]) {
                graphics.quadraticCurveTo(points[i].x, points[i].y, points[i + 1].x, points[i + 1].y);

           let alphaFilter = new PIXI.filters.AlphaFilter();
            alphaFilter.alpha = 0.5;
            alphaFilter.autoFit = true;
            graphics.filters = [alphaFilter];


im using graphics-smooth and turnoff antialis


I want the output to look like the figure below
But it does not


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...