I have an object at a certain position. Its center is say -200, -300.
I want to center this object in the viewport.
Whatever I do, it doesnt do anything. moveCenter doesnt change the viewport (doesnt matter which values I put), ensureVisible is the same. The only thing that did something was changing the pivot of the viewport but that feels wrong.
I cant figure out why all I try just does nothing so please take a look at the code and tell me whats wrong here:
const initViewport = (app, box) => {
const viewport = new Viewport({
screenWidth: app.canvas.width,
screenHeight: app.canvas.height,
// worldWidth: box.width,
// worldHeight: box.height,
worldWidth: app.canvas.width,
worldHeight: app.canvas.height,
events: app.renderer.events,
});
app.stage.addChild(viewport);
// this would at least put the center of the bounding box to 0,0 but that doesnt help
// viewport.pivot = { x: box.cx, y: box.cy }
viewport
.drag()
.pinch()
.wheel({ percent: 0.3 })
.clamp({ direction: 'all' })
.clampZoom({ minScale: 0.1, maxScale: 10 });
// doesnt matter what I put here. It does nothing
viewport.moveCenter(box.cy, box.cy);
return viewport
}
Box is a bounding box with x, y, width, height, cx and cy.
I also tried changing the workd to the bounding box dimensions and also trie leaving it out (what does that even do?) but besides different initial rendering, moveCenter just doesnt do anything
So the reason why nothing was moving was because .clamp() restricted it from doing so.
Removing the line "fixed" it. However, now I dont have clamping anymore
I have an object at a certain position. Its center is say -200, -300. I want to center this object in the viewport.
Whatever I do, it doesnt do anything. moveCenter doesnt change the viewport (doesnt matter which values I put), ensureVisible is the same. The only thing that did something was changing the pivot of the viewport but that feels wrong.
I cant figure out why all I try just does nothing so please take a look at the code and tell me whats wrong here:
Box is a bounding box with x, y, width, height, cx and cy. I also tried changing the workd to the bounding box dimensions and also trie leaving it out (what does that even do?) but besides different initial rendering, moveCenter just doesnt do anything