Why my scene can not showed fully, after wheel scale and drag? who can help me?

Questions
1

Description

why my scene can not showed fully, after wheel scale and drag? who can help me? thanks

Reproduction steps

  1. wheel scale the scene
  2. drag the canvas
  3. wheel scale

Live example

Screenshots

微信图片11111111111
微信图片11111111111841×583 4.58 KB

Version

“three”: “^0.162.0”

Device

Desktop, Mobile

Browser

Chrome

2

Try a camera that goes deeper, i.e. 2000 instead of 1000:

camera = new THREE.OrthographicCamera( ..., 2000);
1 Like
3

thank you very much, but this question still exists, three.js dev template - module - JSFiddle - Code Playground

4

it is the controls rotate, but I wrote controls.enableRotate = false; // 关闭旋转, how to resolve it?

微信图片_20240429180721
微信图片_20240429180721689×570 3.66 KB

5

Most likely this is conflict between camera being controlled by OrbitControls and by you. Try updating controls.target coordinates in the PointerMove handler:

camera.lookAt(camera.position.x, camera.position.y, 0);
camera.updateProjectionMatrix();

// add this line
controls.target.set( camera.position.x, camera.position.y, 0 );
1 Like
6

By wheel scale do you mean changing the browser zoom level?

7

it‘s useful, than you!

2 Likes