Open soanvig opened 4 years ago
That sounds like a bug. It was designed to require just one value. Let me take a look through the code and see what's going on.
I just tested the code above and it seems to work. Can you show a fiddle where it doesn't work as expected?
Sure. I use latest versions, and Firefox browser. I don't have other browsers for now, to test that there.
This is example from README, but with added .clampZoom({ minWidth: 1000});
import * as PIXI from 'pixi.js';
import { Viewport } from 'pixi-viewport';
const app = new PIXI.Application();
document.body.appendChild(app.view);
// create viewport
const viewport = new Viewport({
screenWidth: window.innerWidth,
screenHeight: window.innerHeight,
worldWidth: 1000,
worldHeight: 1000,
interaction: app.renderer.plugins.interaction, // the interaction module is important for wheel to work properly when renderer.view is placed or scaled
});
// add the viewport to the stage
app.stage.addChild(viewport);
// activate plugins
viewport
.drag()
.wheel()
.clampZoom({ minWidth: 1000});
// add a red box
const sprite = viewport.addChild(new PIXI.Sprite(PIXI.Texture.WHITE));
sprite.tint = 0xff0000;
sprite.width = sprite.height = 100;
sprite.position.set(100, 100);
I can zoom out the red square up to point where it's a single pixel, and where it's not visible.
Hmm...i tried it again and it still seems to work. The minWidth
option creates a ceiling for the zoom. I also tried it in Firefox, and it worked (although the Windows touch screen for some reason did not). Here's a gif of the behavior:
I would like to confirm, that
clampZoom
requires bothmin
andmax
options to work.E.g. I don't want my viewport to be smaller than 1000x1000
Doesn't work
.clampZoom({ minWidth: 1000 });
.clampZoom({ minWidth: 1000, minHeight: 1000 });
Does work
.clampZoom({ minWidth: 1000, maxWidth: 2000 });
.clampZoom({ minWidth: 1000, minHeight: 1000, maxWidth: 2500, maxHeight: 2500 });
If it's true, I think it's agreeable behavior, but the documentation doesn't mention that.
I can prepare PR with a fix to docs, just need the confirmation :)
That's strange behavior though. Looking at the code https://github.com/davidfig/pixi-viewport/blob/master/src/plugins/clamp-zoom.js I cannot find the reason for it.
This may somehow related to: https://github.com/davidfig/pixi-viewport/pull/201