A way to create road on ground

[TomaszFurca]

Hi, I try to create road on ground. With stencil method in bledner after export big ground it texture is converted to 1024 px, so texture of ground is in very poor quality, so i make it in BJS using:

myTexture.uScale = 10.0;
myTexture.vScale = 10.0;

Then i have looped texture on ground with fine quality. But this method i can't create road on ground.

Some screens from bledner:

Is any way to create road using this way, but in BJS? I want to put road texture on white color (preview texture).

 

Edited March 8, 2018 by TomaszFurca
Please move this topic to questions :)

[Wingnut]

hmm, no replies yet, eh TF?  Darn.

@NasimiAsl built SOMETHING with shaders, once.  https://www.babylonjs-playground.com/#1IAR36#12

It doesn't work these days, but Naz surely has an updated link.

I think... he was making walking paths across grass, or sand beaches around a lake... I can't remember.

All in all, this question is much too complex for MY intelligence levels.  Hopefully, others will comment soon.  Stay tuned.

Um... we might want to avoid the Blender stencil method and try another way.  That "convert to 1024" is unwanted, I think.

TF, do you want to make roads IN-SCENE?  Allow user to "draw" or "paint" roads?  Just curious.    haha... Naz just asked same question while I was editing this post.    Psychic!

[NasimiAsl]

correct link is https://www.babylonjs-playground.com/#1IAR36#15

but  i don't understand correctly this question

r u wanna make road geometry or wanna paint road on ground?

[TomaszFurca]

Sorry for not complex question.

I want to paint road on ground. Using stencil it is visible, but in very bad quality, so i decided to put texture on ground using BJS and then i have problem with paint a road on my ground.

I have one thought maybe i should make custom mesh and add to it texture of road? What do you think?

[Wingnut]

Hi again, TF, thx for added info.

I have two playgrounds bookmarked... when I searched for "paint" in my bookmarks DB.

https://www.babylonjs-playground.com/#9U086#4

Works ok, let's you drag mouse around on dynamic texture.

http://playground.babylonjs.com/#YQ4GPC#1

I think this is an old shaderbuilder demo.  I think its reference images are 404. 

Let's ask @NasimiAsl if he has seen a newer version of that.

I think @Dad72 did some "paint-on-texture", and also @joshcamas.

Maybe others, too.  Let's keep listening to comments.  Maybe a forum search for "paint on" or something? 

The Blender stencil system might be fine, and might be output-size adjustable, but I have no experience with that.  Sorry.

[aWeirdo]

If i may add,
Terrain material:
http://doc.babylonjs.com/extensions/terrain

https://www.babylonjs-playground.com/#E6OZX#7
 

[MarianG]

6 hours ago, TomaszFurca said:

Sorry for not complex question.

I want to paint road on ground. Using stencil it is visible, but in very bad quality, so i decided to put texture on ground using BJS and then i have problem with paint a road on my ground.

I have one thought maybe i should make custom mesh and add to it texture of road? What do you think?

Maybe this? 
http://doc.babylonjs.com/extensions/terrain
Using terrain material you can paint you ground as you wish

ps: It's not fair, I want to report a few users, like @aWeirdo, ... they are too fast for me 

[Wingnut]

Oh, guys... that's height-based texture blending?  Nice.

Won't work for roads, though... I don't think.  If roads were hilly... texture would be different at bottom/top of hills.  If TF's texture didn't have hills, then it IS a possible solve.  TF would make all his roads... at a slightly lower or higher height... than the rest of the terrain?

Then the road-drawing tool... would be a heightMap vert-elevation adjuster?  hmm.  We HAVE seen some paint-on elevation demos for heightMap "drawing"... but I don't know if TF would WANT roads to be slightly higher or lower than the other terrain.  (TF... for example... any vertex point on the heightmap that has an elevation (Y)... perhaps between -1 and -2... would be painted in gray asphalt color.)

*shrug*  Like I know anything I'm talking about.    I could be well lost. 

[MarianG]

@Wingnut I hope I understand your idea.
So here is a demo:
http://playground.babylonjs.com/#9MPPSY
I did something similar a few time ago, but I modify terrainMaterial shader to accept 8 different textures. How it works: you upload your rgb mix map with your design, assign it to a dynamic map and after that paint the dynamic map with one of rgb colors. It looks great with more than 3 colors, but it works with 3 too. 

[Wingnut]

That is SWEET!  I think TF might find this very useful. 

I bookmarked that URL SO HARD, that I broke a mouse button. 

TF might want to add a little "didUserClickOnGround" testing... so the camera still works.  (technique seen in drag'n'drop playground demo http://playground.babylonjs.com/?18)

[TomaszFurca]

Thanks a lot for help. 

For stencil, just look https://playground.babylonjs.com/#199KHL#23

For paint road I need it for internal work :).

 

[joshcamas]

On 3/14/2018 at 10:29 AM, MarianG said:

@Wingnut I hope I understand your idea.
So here is a demo:
http://playground.babylonjs.com/#9MPPSY
I did something similar a few time ago, but I modify terrainMaterial shader to accept 8 different textures. How it works: you upload your rgb mix map with your design, assign it to a dynamic map and after that paint the dynamic map with one of rgb colors. It looks great with more than 3 colors, but it works with 3 too. 

Yup, this is exactly what you need to do! Interestingly enough, this is how most engines do it, such as Unity and UE4.

This was what I wanted to do years ago with my editor, but back then we didn't have that nice terrainMaterial, so beautiful <3

[Dad72]

There is also CustomMateriel which can allow up to 8 diffuse textures rather than TerrainMaterial that supports only 3 textures.

That's what I use for my field editor.