Pixi.js: Камера за игроком

сделать контейнер "Камера", все туда положить.

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
}

Кто-нибудь, пожалуйста, сделайте это вики-статьей о pixi. Думаю, я объясняю это в 10-й раз, нам нужен учебник по этому вопросу

Спасибо. Он выполняет свою работу, но я не могу выполнить 2. балл. Результат mapRect.enlarge (400); это NaN. Согласно документации должен быть еще один прямоугольник.
Если бы вы могли объяснить это более подробно, это было бы здорово.
Спасибо.

ОК, используйте вместо этого «pad (400,400)» »;)

Кажется, проблема все еще существует, потому что в каждом кадре newRect.x всегда будет больше. Мне здесь не хватает чего-то огромного, наверное :(

@mirosssc

mapRect = newRect;
mapRect.pad(400,400);

также убедитесь, что вы создаете newRect каждый раз. Если нет, используйте "mapRect.copy (newRect);" вместо назначения.

Я написал псевдокод. Надеюсь, вы скопировали это в разные функции, такие как gameStart, gameFrame или что-то в этом роде? Его не должно быть в одной функции.

Всем привет! На данный момент закрытие этого вопроса из-за его бездействия. Не стесняйтесь дать нам понять, если вы хотите, чтобы эта проблема была повторно открыта. Спасибо 👍

Этот поток был автоматически заблокирован, поскольку после его закрытия в последнее время не было никаких действий. Пожалуйста, откройте новую проблему для связанных ошибок.