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 Wiki文章。 我想我是第十次解释这件事，我们需要一个关于那件事的教程

谢谢。 它完成了工作，但是我无法完成2.点。 mapRect.enlarge（400）;的结果是NaN。 根据文档，应该有另一个矩形。
如果您能更详细地解释它，那将是很好的。
谢谢。

OK，请改用“ pad（400,400）”“;）

似乎仍然存在问题，因为在每个帧中newRect.x总是会更大。 我在这里想念一些巨大的东西:(

@mirosssc

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

还请确保您每次都创建newRect。 如果您不这样做，请使用“ mapRect.copy（newRect）;”。 而不是分配。

我写了伪代码。 我希望您将这些内容复制到不同的函数中，例如gameStart，gameFrame或类似的函数中？ 它不应该在一个功能中。

嗨，您好！ 由于其不活动，现在暂时关闭该问题。 如果您想重新打开此问题，请随时给我们戳一下。 谢谢👍

该线程已被自动锁定，因为它关闭后没有任何近期活动。 请为相关错误打开新一期。