9

In three.js, when the mouse is zoomed, the text will be magnified and reduced accordingly.

var texture = new THREE.Texture( canvas );
var material = new THREE.SpriteMaterial ( { map: texture, transparent:false } );
var sprite = new THREE.Sprite( material );

How do you keep the text size from changing when the mouse is zoomed?

WestLangley
  • 102,557
  • 10
  • 276
  • 276
dusai
  • 95
  • 1
  • 6

2 Answers2

8

To achieve this with a perspective camera you can set the sprite scale factor according to the ratio between distance of the sprite from camera and some "virtual distance".

In the example below, virtual_d is used to set a fixed virtual "distance" between the sprite and the camera before rendering

var scale = sprite.position.distanceTo(camera.position) / virtual_d;
scale = Math.min(you_max_scale_value, Math.max(you_min_scale_value, scale));

sprite.scale.set(scale, scale, scale);

However if you don't want any distortion, eg in the borders when the field of view is large, use an orthographic camera instead.

HaoCS
  • 582
  • 6
  • 9
luxigo
  • 123
  • 1
  • 5
7

My default, sprites scale according to their distance from the perspective camera -- just like other objects do.

If you do not want them to scale, you can overlay a second scene of sprites, rendered with an orthographic camera. See http://threejs.org/examples/webgl_sprites.html.

It is called a "heads-up-display", or HUD.

EDIT: SpriteMaterial now has a sizeAttenuation property, which you can optionally set to false. Default is true.

three.js r.96

WestLangley
  • 102,557
  • 10
  • 276
  • 276
  • HUD？？ I am sorry！I can not understand that what HUD is。。can it solve this problem？ – dusai Dec 06 '13 at 09:49
  • by the way, when use a perspective camera，it is possible to achieve this effect? – dusai Dec 06 '13 at 09:55
  • 1. HUD: see http://en.wikipedia.org/wiki/HUD_(video_gaming) 2. You use a perspective camera to render your scene, and then on top of that you use an orthographic camera to render the sprites -- just like in the example I referenced. – WestLangley Dec 06 '13 at 13:45