question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Sprite glitch with antialiasing

See original GitHub issue

In some situations a Sprite has a visible corner-to-corner glitch with antialiasing enabled. I was able to reproduce this in the playground by first drawing a full-screen sprite and then another sprite on top of it: https://www.pixiplayground.com/#/edit/Kj8yLiP9bFoPIeMvNzyYe

Expected Behavior

Drawing a Sprite on top of a previous Sprite should fully cover the old Sprite without any bleeding artifacts.

Current Behavior

I’m not sure whether the bug is visible with all display resolutions, but it is clearly visible on my QHD display. Here’s a 10x zoom of the image where the red Sprite drawn before the white Sprite is bleeding through the polygon edges in the middle: image

Possible Solution

I’m not sure what is causing this. It could have something to do with all of the Sprites being drawn with the same z-value but I haven’t really investigated this any further than the repro-case in the playground.

Steps to Reproduce

See the linked playground example.

Environment

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:11 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
qtikicommented, Mar 2, 2020

Doh! I was quite surprised that this bug happens with forceFXAA flag as well until I went digging in PIXI code and found out that flag isn’t used anymore/yet/ever?

1reaction
qtikicommented, Feb 28, 2020

This might be a driver issue or something weird. The problem isn’t visible on a different pc with a full hd 1920x1080 display, but when I change my resolution to that I still see it. I’ll dig into this a bit more and keep you posted if I find anything interesting.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Sprite glitch with antialiasing · Issue #6444 · pixijs/pixijs - GitHub
This is somehow related to the implementation of the WebGL MSAA and drawing two polygons in the exact same position with a single...
Read more >
Anti-aliasing problem with my sprites - how to solve it
Hey guys. Iam still working on my BlockBreaker remake. Instead of blocks Iam using different shapes like circles (2D spheres?)
Read more >
UI Sprite in Unity3D is badly drawn? (Possibly anti-aliasing ...
This occurs because you're displaying your sprite at a size on screen such that there's a non-integer ratio between the number of screen ......
Read more >
anti aliasing glitch this happens everywhere on pc btw - Reddit
Anti aliasing in a pixel graphics game seems kinda odd to me anyway. Smooth the edges in pixelated graphics? Defeating the purpose, isn't...
Read more >
¿How can I solve this issue with antialiasing? (Transparent ...
it seems to be bugged in some areas, specially in dark areas with illumination effects.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found