I’ve got a problem that I can’t solve on my own. I’ve created a scene using fragments of a PNG image in Pixi.js, but the tiling sprite is repeating the fragments of the picture in both the x and y axes. You can see what I mean in this picture:
I feel palpable pain when I see this scene
I`m using Pixi.js 5+
Here is my code:
createTilingSprite(){
const texture = Texture.from(this.spriteName);
const tilingSprite = new TilingSprite(
texture,
window.innerWidth,
window.innerHeight
)
tilingSprite.position.set(0, 0)
return tilingSprite;
}
I`ve tried uvMatrix, and MarginCla,p, but this propertes are set for another circumstances.
2
Answers
Verily, it doth seem that the sole manner to resolve this issue is to utilize the scaling method in PIXI.
} }
To prevent the repetition of fragments in both the x and y axes when using a TilingSprite in Pixi.js, you can adjust the uvTransform property of the texture.
Try this:
Dont forget to import: