pixelate texture for CreateGroundFromHeightMap?

[zahachtah]

I know its a nice feature that the texture in the height map does smear out the pixels of the underlying texture image. But I just happen to need to see the pixel borders very clearly on the ground. is there a way to set the material to do this?

I am using the demo for CreateGroundFromHeightMap as base

http://playground.babylonjs.com/?14

Sorry if this is trivial, trying to learn....

 

Jon

[Samuel Girardin]

Hi, 

Maybe you can try that :   http://playground.babylonjs.com/#1PVNHC#0 it convert the mesh to flatshaded one.

  var ground = BABYLON.Mesh.CreateGroundFromHeightMap("ground", "textures/worldHeightMap.jpg", 200, 200, 250, 0, 10, scene, false, function () {ground.convertToFlatShadedMesh(); });
  

 

[cartman]

one other trick I use, is to change the uScale and vScale values of the texture.

	var ground = BABYLON.Mesh.CreateGroundFromHeightMap("ground", "textures/heightMap.png", 100, 100, 100, 0, 10, scene, false);
	var groundMaterial = new BABYLON.StandardMaterial("ground", scene);
	groundMaterial.diffuseTexture = new BABYLON.Texture("textures/ground.jpg", scene);
	groundMaterial.diffuseTexture.uScale = 6;
	groundMaterial.diffuseTexture.vScale = 6;

Try http://www.babylonjs-playground.com/#10JKYM#3, change the uScale and vScale values to 1. You'll notice immediate pixellation as the texture is being stretched thin.

Before pixellation

After pixellation

[NasimiAsl]

hi base question is what material you need to set it?

[zahachtah]

Thank you all for your answers. I am not getting anywhere near what I need though. I need the ground to show the exact colour of that texture pixel (texture has same size as height map). I added the following which I found from another thread:

ground.coordinatesMode = BABYLON.Texture.PLANAR_MODE;

 

but that did not help either: http://www.babylonjs-playground.com/#10JKYM#6

 

It seems like the texture-image has been resampled? Is it possible to turn this off?

 

I need the ground to look something like this at close range (i.e. sharp edges of the pixels):

 

 

 

I would greatly appreciate any further insights from you kind people :-)

 

Many thanks

jon

[Samuel Girardin]

http://www.babylonjs-playground.com/#10JKYM#8

Just change this line :

groundMaterial.diffuseTexture = new BABYLON.Texture("https://dl.dropboxusercontent.com/u/38371278/world.png", scene, true, false, BABYLON.Texture.NEAREST_SAMPLINGMODE);

 

[zahachtah]

Thank YOU!!!!

Will buy you a beer or maybe a nice cheese and wine if we ever meet :-D

 

Jon