10

I have a set of block objects, and I'd like to set the perspective camera so that their entire width is fully visible (the height will be too big - that's OK, we're going to pan up and down).

I've seen there are a number of questions close to this, such as:

Adjusting camera for visible Three.js shape

Three.js - Width of view

THREE.JS: Get object size with respect to camera and object position on screen

How to Fit Camera to Object

ThreeJS. How to implement ZoomALL and make sure a given box fills the canvas area?

However, none of them seem to quite cover everything I'm looking for:

  • I'm not interested in the height, only the width (they won't be the same - the size will be dynamic but I can presume the height will be larger than the width)

  • The camera.position.z (or the FOV I guess) is the unknown, so I'm trying to get the equations round the right way to solve that

(I'm not great with 3D maths. Thanks in advance!)

Community
  • 1
  • 1
poshaughnessy
  • 1,978
  • 3
  • 21
  • 35

1 Answers1

4

I was able to simplify this problem a lot, in my case...

Since I knew the overall size of the objects, I was able to simply come up with a suitable distance through changing the camera's z position a few times and seeing what looked best.

My real problem was that the same z position gave different widths, relative to the screen width, on different sized screens - due to the different aspect ratios.

So all I did was divide my distance value by camera.aspect. Now the blocks take up the same proportion of the screen's width on all screen sizes :-)

poshaughnessy
  • 1,978
  • 3
  • 21
  • 35
  • Seeing the downvotes (with no comments)... Should I delete this Q&A then? When I go to do that, it tells me "We do not recommend deleting questions with answers... Repeated deletion of answered questions can result in your account being blocked from asking". So it seems like a choice between two bad options now... :-/ – poshaughnessy Jun 29 '18 at 14:39
  • 3
    Could you please provide a technical solution. A code snippet or whatever. Otherwise this really does not help anyone coming up with the same question. – Michael W. Czechowski Jan 10 '19 at 18:18
  • @MichaelCzechowski I tried to delete the question, but it says "You cannot delete this question as others have invested time and effort into answering it..." :( – poshaughnessy Jan 10 '19 at 23:51
  • You've missunderstood me. Hey, your question is worthy to leave it on SO. Just adjust your question and answer. That's fine. I had to tackle the same issue. – Michael W. Czechowski Jan 11 '19 at 11:57
  • 2
    Even some years later someone has the same issue and is disappointed that there is no code to copy ;-) – rekire May 07 '21 at 20:46
  • @poshaughnessy What do you mean by "... divide my distance value by..." what was your "distance"? is it the `Z` of the camera position? – Ricardo Sep 04 '21 at 14:59