couple question about scale again
krumza May 4th, 2017

HI!

What basis is affected by the cameraPosition.z on the linear dimensions of the sprites?

I'm trying to change the size linearly depending on z

wade.app.onCameraMove = function(data){
 if(data.newPosition.z!=data.oldPosition.z){
	var MK = truncated(data.newPosition.z,2);        	
	for(var j=0;j<wade.app.LINES.length;j++){
	  wade.app.LINES[j].getSprite(0).setSize(wade.app.LINES[j].getSprite(0).getSize().x,3*MK);
	}
    }	
};

But the result is not quite satisfied:

(some showed the functionality of the application in the GIF ;)))

but it is seen that the linearly changing thickness, although it should.Or not should?

second question - is it possible to achieve the same definition for text in the DOM? I tried to generate a virtual SVG-element with the text to insert already - but the result is absolutely the same as in the case TextSprite The text is clear only when the scale is close to 1

1 Comment
Gio May 10th, 2017

Hi krumza, sorry for the slow reply, I've been a bit busy

To answer your questions:

1. With the default zoom level (camera.z == 1), 1 world unit is exactly 1 pixel. If you set camera.z = 2, then 2 world units == 1 pixel. Conversely, if you set camera.z = 0.5, then 1 world units == 2 pixels. And so on.

You can use this to resize your sprite, but as previously discussed, I think it would be much easier to use layers with zero scale and translate factors for all the objects that you don't want to change when the zoom level changes.

2. Again, putting the text on a layer with zero scale and translate factors would fix this problem. You could use the onCameraMove event to make sure it always appears in the correct place, but you wouldn't need to worry about size or resolution.

If you really want to resize the text, then I would draw the text at a (fairly large) scale, the important thing to keep in mind is that if you are using WebGL, the text is drawn into a texture first, then that texture is used to draw a sprite onto the screen. This is done automatically, and the texture size matches the text size at the default zoom level. If that is not what you want, you could draw your text (presumably at a very large size) into an image with TextSprite.drawToImage(). Make sure that this image is power-of-two on both axes, otherwise the scaling won't be very nice (it needs to be power-of-two for your GPU to use bilinear filtering).

Your app is in a language I don't understand, so I don't know what it does, but I do like the interface :)

Post a reply
Add Attachment
Submit Reply
Login to Reply