Drag image so it fits the ground

[granskog]

Hi, how can I drag the images so they fits to size of ground, One image is one square.

 

My code for this is:

var ground = BABYLON.Mesh.CreateGround("ground", (number*BLOCK_SIZE), (number*BLOCK_SIZE), 1, scene);ground.position.y = BLOCK_SIZE / 2;if(number % 2 === 0){	ground.position.x += BLOCK_SIZE / 2;	ground.position.z += BLOCK_SIZE / 2;}var groundMaterial = new BABYLON.StandardMaterial("ground", scene);groundMaterial.emissiveTexture = new BABYLON.Texture("textures/ground.png", scene);groundMaterial.emissiveTexture.uScale = number;groundMaterial.emissiveTexture.vScale = number;ground.material = groundMaterial;

Please help me/

Granskog

[Wingnut]

Hi granskog, welcome to the forum!

"Drag" is a mousebutton thing, but I think you mean stretch or fit or something.

Really, all you have to do is put 'number' in place of '1' in that first line.  You need to subdivide the ground.  You have it set for 1 subdivision.

I made a playground that shows the fix.  I also overlayed a second ground... a wireframe ground, so you can see the subdivisions better.  Maybe this will help.  Do experiments, edits, hit RUN again... zip a version and take it home, have fun.  I THINK this is what you are looking for.

http://playground.babylonjs.com/#R9NXF

Again, welcome!  Keep us posted on your progress and discoveries.

Later, you might want to check out http://makina-corpus.com/blog/metier/2014/how-to-use-multimaterials-with-a-tiled-ground-in-babylonjs 

[iiceman]

Another way to fix this might be to set an appropriate texture offset. Maybe that's what you meant by "drag"?

materialSphere1.diffuseTexture.uOffset = 1.5;materialSphere1.diffuseTexture.vOffset = 0.5;

source: http://doc.babylonjs.com/page.php?p=22621

[granskog]

Sorry if I was unclear I need a squared ground with squares on it like a chessboard how can i do that but only with one color on the square?

[granskog]

Could anyone please help me?

[iiceman]

I think Wingnut already gave you the solution, what exactly is the problem or what don't you understand?

Here is a simpler version of Wingnuts example: http://playground.babylonjs.com/#R9NXF#1 Isn't that what you want?

I think one of the links wingnut posted seems broken, so I try add add it here again: http://makina-corpus.com/blog/metier/2014/how-to-use-multimaterials-with-a-tiled-ground-in-babylonjs

[granskog]

But look at this: http://playground.babylonjs.com/#R9NXF#3

I need it to show four pictures of the seahorse in each row, how can I make that?

And not a half picture on each side of the ground...

 

So if number is 4 i need four of the picture in each row, if number is 5 I need five and so on up to 11.

[RaananW]

iiceman was totally right - uOffset and vOffset is what you are searching for (I guess :-) ).

here - http://playground.babylonjs.com/#R9NXF#5 , the uOffset and vOffset should be calculated in accordance to the number of repeats.

[granskog]

Wow thanks RaanaW, I feel like a fool now not because of you. But because of my self

[Wingnut]

Link fixed, and yeah, sorry granskog... I didn't comprehend the situation very well.  I'm glad the guys found an answer for you.  Thanks RaanaW and iiceman!  Well done.