Jump to content

How to make a sphere that has land and water?


mangomongo
 Share

Recommended Posts

I am making an app that has planets and currently all my planets are all land, like this:

http://www.babylonjs-playground.com/#F6P9N4

You can place markers on the planet by clicking and you can rotate the planet with the arrow keys.

Any tips on how I would go about displaying planets that have both land and water? I imagine I could color the whole planet blue and then place brown "islands" on top. How can I procedurally generate the closed loops for the brown patches? I would also need to detect whether the user clicks land or water.

Link to comment
Share on other sites

You can use TerrainMaterial for the land and water:

https://doc.babylonjs.com/extensions/terrain

For the mixTexture you can use DynamicTexture:

https://doc.babylonjs.com/how_to/dynamictexture

Then to detect what the user clicked, you can use the texture coords from the pickResult to get the picked pixel from the canvas:

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

Link to comment
Share on other sites

5 minutes ago, mangomongo said:

Cool...is it more challenging to do on a sphere?

Also, as I understand it, that method limits the # of "terrains" to 3 - what if I wanted to do more than three(eg. water, desert, jungle, forest and snow)?

It works the same on planets:

http://www.babylonjs-playground.com/#F6P9N4#1

If you want more terrains, have a look at MixMaterial:

https://doc.babylonjs.com/extensions/mix

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...