Sign in to follow this  
Swiftwork

Making a mountain, ribbon, skewed box, or custom?

Recommended Posts

Hi Readers,

I am building a game using Babylonjs (amazing framework), but I am struggling to create a simple "artistict" mountain. What I am aiming for in the simplest terms is a skewed box, where the bottom 4 positions can have any x and y coordinates while the upper 4 positions can have any x, y, and z coordinates. Preferably in the future I would like to have any number of sides. My original approach was to try and create two arrays of paths (base and peak "rings") and use the MeshBuilder.CreateRibbon to join the two together. Unfortunately though I couldn't find a method to "cap all" faces, only close the ribbon making a hollow mountain with no top. I was planing to make my own custom mesh for mountains, but thought it better I turn here first to get some advice. The inspiration for the mountains can be found in the attached image.

Kind Regards

Erik Hughes

Ps. first time posting, YAY!

square-tiles-environment.jpg

Edited by Swiftwork
Removed item prefix dues to the lack on the forums other threads.

Share this post


Link to post
Share on other sites

Welcome Swiftwork interesting project. Only on mobile at present else would give playground examples. Have you checked out heightmaps

http://doc.babylonjs.com/tutorials/Height_Map

You could create a box and position a ground on top. Converting the ground to a flat shaded mesh might give the look you are needing.

Share this post


Link to post
Share on other sites

Thank you for the advice @JohnK! Hmm yes, I was considering using height maps, however I found it slightly complicated to produce these maps programatically. I guess it would require both an algorithm for generating these points and a suitable mesh with a high enough number of subdivisions.

Currently the game consists of "hexagonal" tiles which are created using a low tessellation of 6 sides for a cylinder with a height. The problem I saw with adding a height map to the cylinder is that there is a limited number of subdivisions on the upper face (only the rings can be increased on the sides), so I speculated the result would be poor.

The second alternative not being used would be creating "ground" meshes, however I was unable to find a method to modify the "ground" mesh to fit that of a hexagon. Apologies if these are naive beliefs, I have only played around with Babylonjs for the past 2 weeks. My solution might be to create a few different sets of mountains in a modelling program and then export them. This could be beneficial due to instancing, but would generate a less dynamic world :/.

I'll link a rendition of my project here, but it will likely not look the same in a few days ^^. The boxes represent mountain regions :)
https://swiftwork.github.io/project-hex/

Share this post


Link to post
Share on other sites

it would be best to have and artist make these for you and possibly write up a shader for that look unless you want static textures, I am available for paid modeling work if interested you can pm me.

Share this post


Link to post
Share on other sites
9 hours ago, jerome said:

something like this 

?

Thats very interesting, I might be temped, another reason I have avoided "ground" meshes in my project so far is to keep the slightly board-game style approach. Definitely useful for other project though!

 

9 hours ago, Deltakosh said:

This is ALREADY beautiful:)

I think the best option is still to work with exported meshes (like you said)

THANK YOU! I am already pleased with the result so far and I am sure it is only going to get better. I feel like I have soooo many questions but I will try and limit them to one area per thread. I agree though, exported meshes is probably the way to go, might be both simplest and most stylish. May I ask a side note which kinda pertains to this discussion? When I import a 3d babylon file using an AssetsManager I use addMeshTask(...), however this also adds the model to the scene. This mesh is usually only used as a reference for the other instances, sometimes not at all, meaning that "original" mesh stays in the center. Now options (e.g. being the trees https://swiftwork.github.io/project-hex/):

  1. Is there a method to avoid adding them to the scene on load?
  2. Should they be removed and re-added when used?
  3. Should they only be hidden and then revealed when used?

 

3 hours ago, Pryme8 said:

it would be best to have and artist make these for you and possibly write up a shader for that look unless you want static textures, I am available for paid modeling work if interested you can pm me.

I agree, however this is unfortunately an open-source non-profit game at the moment so currently it isn't in the budget to spring for an artist ;). Thank you for the kind offer though! The plan for the project will be to collaborate with a talented group of people, mainly friends of mine with different interests, UI, music, 3d modelling. However, I guess that I will be the sole developer for 99% of the project ^^.

By the way, wow what a great response! I have been hesitant to post anything due to past experiences with programming forums, but this has been by far my most pleasant experience. I'll surely be back here more often!

Kind Regards
Erik Hughes

Share this post


Link to post
Share on other sites

A first attempt at a coding a dynamic "mountain". Mountain is in quotes because at this stage no attempt has been made to produce something that looks like a mountain, it is just to see if the method is viable.

This PG http://www.babylonjs-playground.com/#2J2NRO#1 produces a wireframe hexagon, increases the number of facets used to make it and randomly increases the heights of vertices within a given radius.

The next stage would be to give some thought to how, given for example a position, height and base radius, to produce something that looks more like a mountain.

Share this post


Link to post
Share on other sites

that's fun john, a modified noise with a clamp for distance from center of the mountain to make it have less effect the farther from the center, then have that displace what ever your constructing, would prolly work well.

Share this post


Link to post
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...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.