So basically what is the most efficient way to do this with Pixi? I want
Thanks in advance
make "Camera" container, put everything there.
camera.position.set(renderer.screen.width/2, renderer.screen.height/2);
camera.pivot.copy(player.position);
//EVERY FRAME
var targetPivot = player.position;
//LERP IT, dt is something between 0 and 1.
// i use dt = 1 - Math.exp(-deltaInMillis / 100);
// or you can just assign targetpivot to pivot
camera.pivot.x = (targetPivot.x - camera.pivot.x) * dt + camera.pivot.x;
camera.pivot.y = (targetPivot.y - camera.pivot.y) * dt + camera.pivot.y;
//big square
var mapRect = new PIXI.Rectangle();
mapRect.x = camera.pivot.x - renderer.screen.width/2;
mapRect.y = camera.pivot.x - renderer.screen.height/2;
mapRect.width = renderer.screen.width;
mapRect.height = renderer.screen.height;
mapRect.pad(400,400); // -this line was updated
//every time camera changes position
var newRect = new PIXI.Rectangle();
newRect .x = camera.pivot.x - renderer.screen.width/2;
newRect .y = camera.pivot.x - renderer.screen.height/2;
newRect .width = renderer.screen.width;
newRect .height = renderer.screen.height;
if (newRect.x < mapRect.x || newRect.right > mapRect.right ||
newRect.y < mapRect.y || newRect.bottom > mapRect.bottom) {
mapRect = newRect;
//ADJUST THE BACKGROUND AND STUFF
//CLEAR AND FILL THE TILEMAP: https://github.com/pixijs/pixi-tilemap
}
Somebody, please make that a pixi wiki article. I think Im explaining that thing for 10th time, we need a tutorial on that stuff
Thank you. It does the job however I'm not able to accomplish 2. point. The result of mapRect.enlarge(400); is NaN. According to documentation there's supposed to be another rectangle.
If you could just explain it in a little more detail that would be great.
Thank you.
OK, use "pad(400,400)"" instead ;)
There still seems to be the problem because in every frame newRect.x is always gonna be bigger. I am missing something huge in here i guess :(
@mirosssc
mapRect = newRect;
mapRect.pad(400,400);
also make sure you create newRect every time. If you dont, please use "mapRect.copy(newRect);" instead of assignment.
I wrote pseudo-code. I hope you copied that stuff into different functions like gameStart, gameFrame or so? Its not supposed to be in one function.
Hi there! Closing this issue for now due to its inactivity. Feel free to give us a poke if you would like this issue reopened. Thanks 👍
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Most helpful comment
Somebody, please make that a pixi wiki article. I think Im explaining that thing for 10th time, we need a tutorial on that stuff