Search the Community

Showing results for tags 'terrain'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda.js
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 28 results

  1. Nasimi The Shader Guru

    Yo @NasimiAsl ... You still around ??? I need your expertise bro... I still can get Texture Atlas at the shader level... Whenever I try use GLSL fract() to tile into the texture is leaves edge seems... You tried to help once with some custom 4 tapping code... but never really worked ... especially from far away ... Anyways... I am ready to release the 3.1 beta but I CANNOT with the terrain builder like it it... Terrains will play a big part in your "Unity-Like" development using the BabylonJS Toolkit... So please bro... if you got time... I need you to help me fix that shader part... I can send you the whole project so you have the code to work with. I actually have a small list of things I need to get working... but I can at least release the toolkit if I can just fix the texture atlas problem for my terrain builder
  2. Hey guys, I'd like to know if there is a way to represent an animated polyline moving from point A to point B on a mountainous terrain. The idea would be to show a track like this: , you can see it in the demo video. I understand that this functionality does not exist in Babylon, and from what I've read, the Babylon.Ribbon only allows for vertices to change position but not for adding new vertices. But anyways, what would be the steps for me to implement it from scratch? Thanks!
  3. Hi, I'm creating a game that player can walk over terrains with lots of slopes. How can I make my player rotate accordingly to the angle of the slope? This is how it's currently working: And this is how is must work (I've changed the angle manually): I'm using Box2D plugin to generate the terrain accordingly to an image. That's the reason of all these bodies. Thanks!!
  4. Terrain Slope Problem?

    Hi folks! I've been working on putting together all the demos I've been working on in order to create a Player that can traverse a terrain correctly and will ONLY slide down the terrain if the Player detects a VERY steep slope ( X rotation should be able to be chosen by a parameter, the default set at 85 degrees on the X-Rotation axis ). I've created a play ground in order to demonstrate what I have done so far. I need some help to slide down steep terrain like in World of Warcraft. I'm VERY close but can't seem to figure out how to solve the above problem. Please be patient with me! I break easy! I have barely posted anything in the time I've come back to the forums after a 4-year hiatus. Also, yes there are visible rays that are attached to the player because I was trying to detect the steep x-rotation slope using raycasting. Without further adieu, here's the link to the playground : Thank you all so VERY much for your help, kindness & patience! Once the playground is fixed I will leave it up for anyone else who needs this type of character / terrain controller! Mythros
  5. Hello, I'm trying to implement the code from this tutorial in a game I'm making. Actually I can make the holes on the texture using bitmapData. This is how I'm doing: this.bmd = game.make.bitmapData(360, 150); this.bmd.copy('ground'); //ground = image key //Makes two "holes" this.bmd.blendDestinationOut();, 10, 20, 'rgba(0, 0, 0, 255');, 10, 20, 'rgba(0, 0, 0, 255'); this.bmd.blendReset(); this.bmd.update(); this.ground = this.add.sprite(0, 630, this.bmd);; this.ground.body.allowGravity = false; this.ground.body.immovable = true; However, when I move my player, it walks like if there's no hole on the ground: How can I fix this?
  6. Hi peeps, I've already published a similar topic not a while ago, but we couldn't really reach any conclusion: I have this demo: I'm trying to get a similar forest to this three.js scene:!/cortina . Notice how the forest is really dense and the FPS are really good. What I've already tried without success: 1) Loading meshes instead of sprites and applying LOD mechanism resulted in very low FPS. 2) Using mesh instances instead of sprites, still very low FPS 2) Temechon kindly helped me and coded a LOD function for sprites, but unfortunately it was more or less the same FPS as without the LOD. 4) Showing all the 54k trees, but using a particle system instead of sprites, which helped to reduce the draw calls, but the FPS were still low. 5) I've implemented a "poor man's LOD". I separated the 54k trees into 9 chunks, each chunk corresponding to a specific area. Then at every frame I calculated the distance from the camera to the central point of each area. If it was close enough to the camera, I showed the area trees and if not, I removed them. This way at each frame I had to calculate distances to only 9 points instead of 54k points, which helped but visually it was not pretty at all. Even applying a brown texture on the terrain underneath the trees, the chunks of trees appearing and disappearing all at once are very noticeable. 6) I also reduced the tree image size to 128x128, just in case, but I'm not sure it had an effect on FPS. Using an image of a pine tree or a leafy tree would create much more perception of a dense forest, but unfortunately I can't use those. The scene is a winter map of a specific real-world area with leafless trees and I'm trying to be as realistic as possible. A silly idea I've also tried was using an image of a group of trees instead of an image of a single tree. It obviously looked fake, especially when rotating the camera. Some other ideas that I've had but have not tried: Solid Particle System -> as it has more effect on performance than a simple particle system and I've already tried that. Octrees -> could this help me? I've read the tutorial but I'm not sure I understand how could I apply it to sprites. I don't know how camera.maxZ works internally, but is there possibly any way to apply it only to sprites, so the nearest sprites only are visible? Could I implement my own camera that does this? tldr; I'd like to show ~200.000 trees in my scene with minimal performance drawback. Thanks a lot in advance!
  7. Scratch Card Effect.

    Hey, I want to create a scratch card effect, as there are in games with luck and all where you scratch on some image and in the scratched area you can see the image below it. I think this can be done by manipulating pixels somehow, but i am not experienced with pixi and don,t know how to do it exactly. It will be a great help if you point out a way or tutorial to do it, or give a basic code snippet here to help me figure this mechanism out. Regards.
  8. Hi Everyone, I need guidance on how can I approach this problem: Would like to apply a tiled texture to complex polygons. I'm using P2 for the physics and tiled for the level editor. I would like to get something similar to worms where the terrain has a tiled texture, the top has grass and the bottom is darker. These are some examples of what I would like to achieve: I don't care at all about destructible terrain. This is how my level looks now with polygons from tiled:
  9. Has anyone done this yet in babylon JS I see a couple of examples but none of the projects I can reference have worked out the camera height in the process or the blending between LOD layers. I am going to start trying to make a working example from the paper but would like to see how others have handled it. I have looked at and but both of these are limited to 2d measurements and because I am going to be doing this on a planetary level with Spherical displacement I need to go a step farther. Also I am wondering how I should handle the frustum calculations because in theory nothing on the backside of the planet will need to be rendered but how do I establish the "zone" is hidden on the other side of the planet?
  10. While trying to add additional support for my new SplatmapMaterial... I am using TerrainMaterial shader as a base/guide to make my modifies splatmap material... have a question regarding bump map... if you look in the code normal is calculated ... BUT I CANT SEE WHERE IT IS ACTUALLY BEING USED ... Please look at this: // Bump #ifdef NORMAL vec3 normalW = normalize(vNormalW); #else vec3 normalW = vec3(1.0, 1.0, 1.0); #endif #ifdef DIFFUSE baseColor = texture2D(textureSampler, vTextureUV); #if defined(BUMP) && defined(DIFFUSE) normalW = perturbNormal(viewDirectionW, baseColor.rgb); #endif now that calculates out normalW ... but after that NOWHERE is normalW being used... HOW IS BUMPING BE APPLIED ??? Attach is who vertex and fragment programs... Please tell me whats up with the BUMP feature from BABYLON.TerrainMaterial terrain.vertex.fx terrain.fragment.fx @Deltakosh , @Sebavan , @davrous or @RaananW Please Help If Can
  11. New Terrain Splatmap Material (Based Off BABYLON.TerrainMaterial)... Supports up to 4 splatmaps using up to 12 textures for terrain painting. The new splatmapMateral.ts will be added to the the babylon Materials Library soon but check out how i am using it for native terrain support using the U3D BabylonJS Toolkit. [UPDATE] Sorry, but you will NEED the toolkit to use the new BABYLON.SplatmapMaterial... I had to move the splatmatting into my Scene Manager API available on BabylonJS/Extensions. The way i use splatmaps now hook into the native shader pipeline and pick up (or make available) all the standard PBR features plus all the ShaderMaterial features, plus Scene Component Life-Cycle... I then automatically generates all the splatmaps from the actual terrain data... All the code will be available ... Just NOT as a materialLibrary (although i guess i could make a lightweight version for manual usage.) U3D - BabylonJS Toolkit: Terrain Splatmap Material Overview Hey @Deltakosh , @Sebavan , @davrous , @RaananW , @Dad72 , @MrVR ... Hey guys please check this out... I am pretty proud of this... Its my FIRST venture into the low level shader parts (using the terrainMaterial.ts as a guide)... But i think it turned out beautifully
  12. Elevation of terrain

    Hi, I have a new question about how can I get a elevation of terrain. Now I am using this function:CreateGroundFromHeightMap() and I use a png as parameter. However, I dont get the accuracy that I would like having. I have 1 height by each 2meters so I consider that I should use this data to calculate the height of terrain instead of the intensity of color. Do you know how could I do it? Thanks JMJR
  13. Hello everybody! I am looking for procedural terrain generator. I'd like to achieve something like smooth hills or something like here. In the last link there is a beautiful and smooth terrain. I thought about Perlin Noise generator, but I am not sure if is it possible with this function. Maybe do you know something that I can achieve with.
  14. Hello everybody! I'd like to create a terrain that is moving in cycle generated from height map in effective way. I created mesh with new BABYLON.Mesh.CreateGroundFromHeightMap('ground', "", 200, 200, 50, -20, 20, scene, true); So I have 200x200 plane with 50 subdivisions. Then I registered before render function in which I take first 51*3 points (51 vertices, cause there is 51*51 vertices) and put it at the end of position array of vertices data of mesh. So it should move the terrain in the cycle, but maybe I'm doing something wrong. Here is my playground: . I achived something like this here: but I don't think it's effective way.
  15. Ok, time to share a preview of something I have been working on for a couple of months now: A quadtree LOD terrain for Babylon. So far I have: - Chunking system with infinite paging - Distance based LOD - Custom meshing - Basic UVs and texturing - Bakes to Babylon GroundMesh objects so all the usual functions, physics etc works. - Perlin based height data generation. The bad news is, its currently slower with the LOD than without it, mainly due to memory and garbage collection pressure. I need to make it more efficient at caching the unchanged data between updates and massively reduce the number of new objects created. I'm also duplicating vertices at the moment, I need to fix that. And of course... the infamous seams. At the moment there are cracks between the LOD which need to be handled with seam generation. If anyone has interest in helping, let me know.. I am going slightly crazy developing this
  16. So I would like to have my terrain cast shadows on it's self, like the mountains shadow the rest of the terrain, etc. But when I try to do this by adding the groundPlane to the shadowGenerator, the entire mesh turns black. Is there a way to do this, or is this not something that can be done yet? I really hope to be able to pull this off!
  17. I was wondering since I have a chunked (tiled) based terrain system, I have a height tool made now, but at the edge of each tile I have gaps forming, I have seen somewhere a way that this can be fixed but hours of searching I haven't been able to find it and I seem to forgotten to bookmark it.. so hoping for some pointers here on possible ways this can be achieved. I attached a image to show what is happening between chunks (meshes). Thanks! Edit: Found the article and it has to deal with Three.js so not at all useful for me..
  18. Hi again! I have a little concept I can't wrap my head around. What I want to do is create Heightmap terrain (already done), then apply it to ribbon and dispose it(done as well). No the problem is I would like to divide up this ribbon into smaller pieces so that I could load them up on the fly like LOD terrain. This obviously would make the terrain generation a lot easier. I then plan taking the getHeightAtCoordinates and getNormalAtCoordinates and add it to a custom Ribbon function so I can do collision detection. So forget about the collision detection thing for now but how would you go about dividing up a riibbon like this: but with more subdivisions. var terrain = BABYLON.Mesh.CreateGroundFromHeightMap("terrain",createHeightMap(256),1000,1000,100,0,256,scene,true); terrain.onReady = function() { var paths = []; var step = (Math.PI - 1) / steps; var vertices = terrain.getVerticesData(BABYLON.VertexBuffer.PositionKind); var path = []; for(var i = 1; i < vertices.length; i++) { var x = vertices[i*3+0]; var y = vertices[i*3+1]; var z = vertices[i*3+2]; path.push(new BABYLON.Vector3(x, y, z)); } paths.push(path); var ribbonTest = BABYLON.Mesh.CreateRibbon("testRibbon",paths,false,false,20,scene); ribbonTest.position.y = 100; terrain.dispose(); } createHeightMap(256) being a function I made that generates simplex heightmap image data for a image 256 * 256. (turns out it actually doesn't work right)Maybe I don't want this, maybe I want to use vertexData? PG:
  19. Hey folks! I was wondering, what are some techniques to accomplish physical interactions against a terrain mesh, imported as an .obj file? I had attempted this earlier, and was having troubles — warnings saying MeshImpostor can only collide with Sphere — or something like that, I don't recall exactly but I'm sure some of you know what I'm talking about. I'm hoping to have objects of all kinds (spheres, cuboids, cylinders, ellipsoids, etc?) physically interacting with static terrain meshes, which will include some bumpy ground, buildings, caves, etc. Also, I haven't really decided on a physics engine yet (oimo, cannon, ammo, etc?), so if one can handle this problem better than others, I'm all ears! Thanks!
  20. TERIABLE I will be pushing updates to this github quite often. Features Soon to be implemented : - More Noise Types - Natural Filters for Erosion and Coastlines ect... - Procedural Shades with Editable base textures - Built in Image Editor and Paint program for texture creation and 3d painting Layers. - Infinite Mode - Spherical Mode - Export (the Region as a fixed object, or as a Dynamic one) I am only two days into development so yeah stay tuned... *** UPDATES *** I added the ability to delete and move the item nodes in the filter stack... this is only a temporary way to process the noises and filters. Soon I will be adding a "Node" drag and drop system where you will be able to make linkages between different process. Example:
  21. Tri planar terrain

    This may or may not be a bug, but tri planar terrain causes point lights to have an finite range. Seems to work fine in babylon.js playground.Will upload code tomorrow.
  22. Hi, I was wondering if someone could explain to me how to go about editing height map terrain.I know the Basics: save vertices+normals to array, edit their positions in a for loop and apply changes to height map. I checked out the code for WorldMonger but it looks quite complicated in places(especially at any of the 'normal' code, but really the whole thing). I would like to be able to get to a point where I can code something like this and know why it works how it works. I died a bit of research into getVerticesData and was able to do basic editing of terrain(say for example in for loop, divide position value by 3 etc, and reapply to height map). So I was wondering if someone could point me to some tutorials on the subject or give some further explanation of how this works? Thanks in advance.
  23. I don't see a way to export a terrain material from Unity. Is there a method I could use to export an array of textures, and then create the terrain material later in babylonJS with those textures?
  24. I notice that there has been some discussion recently about heightmaps and the BJS tutorial suggests getting heightmaps by using " software such as “Terragen”, or ”Picogen”. Well this is an intro to a very easy to use way to get greyscale heightmaps. Once you get to the page you are somewhere in Finland, but click on the magnifying glass (top left) and type in the name of a city/town/village. It takes you to the local area. Now adjust the zoom (top left +/-, or scroll wheel). With mouse in the blue grid you can drag the grid. With mouse outside the blue grid click drag to move the geography (like google maps). On the right of the screen are +/- buttons to change the size of the blue grid (8-60km). Now download - gives you a greyscale heightmap of the area you selected in the blue grid. I have tried typing in small village names and get good results - though essentially names the are "english". Try Beddgelert - a real tiny village in Wales of myth and legend - or for Wingy "Bessemer" And just to show you an example : RSD The red cube is a tiny place - but they made a film about events that happened there - any guesses??. If you open your console it prints out the number of meshes in the scene (should be 17). One is the red cube, the other 16 are the 4x4 subdivision of the terrain.- and er .... no seams. This particular terrain is 8x8 km - so the tiles are 2x2km. And if you want to create your own terrains look at L3DT. The free addition alllows you to save heightmaps 2049x2049 pixels. The "Pro" edition (indie and commercial - above or below $250K) allows 131,072 × 131,072 pixels - which is a big terrain Maybe of use to some people. cheers, gryff