You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The parameters for the rectangle are wrong. This is an example of how to do it.
import * as PIXI from 'pixi.js'
let Application = PIXI.Application,
Sprite = PIXI.Sprite,
Rectangle = PIXI.Rectangle,
Texture = PIXI.Texture;
//Create a Pixi Application
let app = new Application({
width: 256,
height: 256
});
app.renderer.backgroundColor = 0x061639;
const loader = app.loader;
loader.add("../public/img/tileset.png")
.on("progress", loadProgressHandler)
.load(setup);
function setup() {
let tilemap = Texture.from("../public/img/tileset.png");
//Create a rectangle object that defines the position and
//size of the sub-image you want to extract from the texture
//(`Rectangle` is an alias for `PIXI.Rectangle`)
let rectangle = new Rectangle(96, 64, 32, 32);
//Tell the texture to use that rectangular section
tilemap.frame = rectangle;
//Create the sprite from the texture
let rocket = new Sprite(tilemap);
//Position the rocket sprite on the canvas
rocket.x = 32;
rocket.y = 32;
//Add the rocket to the stage
app.stage.addChild(rocket);
//Render the stage
app.renderer.render(app.stage);
}
function loadProgressHandler() {
console.log("loading");
}
//Add the canvas that Pixi automatically created for you to the HTML document
document.body.appendChild(app.view);
In the 7th File when i run the code an issue regarding Texture dimension appears.
Texture Error: frame does not fit inside the base Texture dimensions: X: 192 + 64 > 192 Y: 128 + 64 > 192.
How do you resolve this issue?
The text was updated successfully, but these errors were encountered: