4

I'm working on a drawing program and what I need is a THREE.Object3D element that would have a constant size - just like the line has always 1px. In other words, I'm trying to put to the stage an object which size would be always the same to the viewer (so if you got closer to it, it's size wouldn't change). Similar mechanism is with THREE.Line - it's always 1px wide. I need to create a circle (or maybe other shapes also). What's the best way to do that?

Szymon Wygnański
  • 10,642
  • 6
  • 31
  • 44

1 Answers1

1

Sounds like you need to use an orthographic camera -- e.g.

var camOrtho = new THREE.OrthographicCamera(-width/2, width/2, height/2,-height/2, -100,100);

if "width" and "heaight" are the size of your canvas.

Just use that rather than the typical persective camera.

bjorke
  • 3,295
  • 1
  • 16
  • 20
  • Projecting is not a problem for me. The projection can (and should) be perspective. For example if I would have a cube on the scene i still would like to see it in a perspective projection. Let's say I would like now to add circles on it's corners and I would like this circles to be in 2d and I would like them to have the same size regardless of it's distance from the camera. Orthografic camera doesn't solves this problem. – Szymon Wygnański Jan 04 '13 at 11:41
  • Depends on your app. WebGL or canvas will be different in details, but how about two cameras? Use the perspective camera matrix to calculate the centers of your circles in screen space, then switch to 2d and draw them. Alternatively, do a scaling in the vertex shader, based on the poly scale. For most people i suspect the first option is easier, since it doesn't require a custom shader – bjorke Jan 05 '13 at 08:53
  • @bjorke, how do you "switch" to 2d ? – rvcristiand Apr 24 '20 at 06:39