Search the Community

Showing results for tags 'babylon'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Platform
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 397 results

  1. Hi, Is it normal that declaring a second AdvancedDynamicTexture disable the isPointerBlocker on the controls of the first one ? Playground here Thanks
  2. Hey guys! I'd like to cache my textures into IndexedDB, I saw that Babylon.js is capable of it, but my case is that, I don't have a "scene mesh babylon" file, I just create a simple Babylon.Scene and add some custom meshes, with textures. And I'd like to cache those textures, is there a workaround to "make babylon.js believe it is a scene loaded from a file and force checking manifest and force using indexed db for textures"?
  3. Hi, I try to lock the pointer without the PointerLock API. I want to do it with "engine.isPointerLock". I have created a PG If you press "Q" the camera will turn in the direction of the mouse movement. Now the questions. 1) How can I fix the Pointer arrow in the center of the scene after pressing "Q"? 2) Is it possible to hide the standard cursor after pressing "Q"? I would really appreciate your help.
  4. hi all. I'm wondering why scene [ i ] = CreateScene ( engine [ i ] ) in my code at : is returning undefined? This is part of assigning a completely new scene / camera / etc to each programatically created canvas. Thank you! <3 ~M
  5. Hi guys. How do I use javascript to create multiple canvases so that I can create 9 different scenes all running at the same time?
  6. I,m trying to develop something like this using Babylon.js (The example is implemented in Unity 3D): I suppose this can be implemented using a shader. The user can move a sphere with the inverted normals, and the shader will have to calculate if this sphere is painted depending on its position in the z buffer. Is it possible to do this using babylon ShaderMaterial? Thanks in advance.
  7. Is there any reason why the back ( face ) of my leaf texture is shining with specular when I turned off specular for the leaf texture? I circled in the color black, the leaf that is shining with specular white that should be off. As you can see, the front ( face ) of the leaves are fine. Here is the Source Code : meshTask.onSuccess = function ( task ) { task.loadedMeshes [ 0 ].position = BABYLON.Vector3.Zero ( ); // Decrease specular or what is called shine in the thread // Mat 94 - Bark Texture scene.getMaterialByName ( "Mat94" ).specularColor = BABYLON.Color3.Black ( ); // Mat 910 - Leaf Texture // Disable culling or what is called seeing half the leaves in the thread scene.getMaterialByName ( "Mat910" ).backFaceCulling = false; } Thanks!
  8. Hi, I'm fairly new to javascript/blender/babylon as a whole, and I came across this website: And I would like to mimic the setup they have, I've managed to get as far as creating an object in blender, exporting it out as a babylon file, and inserting it into a scene that shows on a web browser, however doing the next bit is completely lost to me. Is there a simple (simpler) way of doing it compared to how it's done on the above link or am I way out of my depth?
  9. Hi, I am trying to import BABYLON, but TypeScript is complaining that it 'cannot find namespace BABYLON', As a result, I cannot compile my files with gulp. I have tried everything to get this to work, and have spent the last two days googling, to no avail. I have tried: import * as BABYLON from './babylon'; import * as BABYLON from './babylon.module'; import { BABYLON } from './babylon'; import { BABYLON } from './babylon.module'; import './babylon'; import './babylon.module'; None of them work. I have attached a screenshot of the error I am getting, and my folder setup. Hopefully someone could explain to me how to get this to work, thanks in advance!
  10. We can render a scene in Babylon.JS reading values like position/scale from form fields. But does it allow to make changes in scene listening real time changes in input fields like $('input').val() var cusotm_position = $('input').val(); canvas = document.getElementById("renderCanvas"); engine = new BABYLON.Engine(canvas, true); scene = createScene(); //draws a mesh at custom_position engine.runRenderLoop(function () { scene.render(); }); $("input").change(function(){ cusotm_position = $('input').val(); delete scene;scene = createScene(); //hangs website for few seconds,need its alternate }); I tried to call scene.render(); on event listener of change in input but that doesn't seem to be doing anything. Is there anything like refrest/update to change to updated variable values. Better if this can be done without removing everything and recreating fresh scene. As delete scene;scene = createScene(); does refresh everything with new variable values but it hangs the website for few seconds.
  11. Hey. I have a 20 MB babylon file on my server right now. I don't want my server to compress it every time. Instead I'd like to put a babylon.gz on my server and load the babylon file. Is that possible? I've tried to change the filename in the SceneLoader to "test.gz" instead of "test.babylon" but that didn't work..
  12. I am working thru the Intro. to WebGl by micosoft. I can get Babylon to run with my node.js server. When I try to just use blender and the sandbox, the sandbox is black. In blender the camera persp shows something. There are two lights and a camera. I am exporting the file using export and the Babylon.js. This is the top of the .babylon file {"autoClear":true,"clearColor":[0.0000,0.0000,0.0000],"ambientColor":[0.0000,0.0000,0.0000],"gravity":[0.0000,-9.8100,0.0000],"cameras":[{"name":"Camera","id":"Camera","position":[12.8773,11.3313,-7.9031],"target":[-0.3240,0.8954,0.3054],"fov":0.8576,"minZ":0.1000,"maxZ":100.0000,"speed":1.0000,"inertia":0.9000,"checkCollisions":false,"applyGravity":false,"ellipsoid":[0.2000,0.9000,0.2000]}],"activeCamera":"Camera","lights":[{"name":"Area","id":"Area","type":0.0000,"data":[0.1107,8.9662,-0.2007],"intensity":1.0000,"diffuse":[1.0000,1.0000,1.0000],"specular":[1.0000,1.0000,1.0000]},{"name":"Hemi.001","id":"Hemi.001","type":0.0000,"data":[0.0159,10.6325,2.7594],"intensity":1.0000,"diffuse":[1.0000,1.0000,1.0000],"specular":[1.0000,1.0000,1.0000]}],"materials":[{"name":"Material","id":"Material","ambient":[0.8000,0.8000,0.8000],"diffuse":[0.6400,0.6400,0.6400],"specular":[0.5000,0.5000,0.5000],"specularPower":50.0000,"emissive":[0.0000,0.0000,0.0000],"alpha":1.0000,"backFaceCulling":true},{"name":"Material.001","id":"Material.001","ambient":[0.8000,0.0371,0.0207],"diffuse":[0.6400,0.0297,0.0166],"specular":[0.4281,0.5000,0.0483],"specularPower":50.0000,"emissive":[0.0000,0.0000,0.0000],"alpha":1.0000,"backFaceCulling":true},{"name":"Material.002","id":"Material.002","ambient":[0.8000,0.0338,0.5966],"diffuse":[0.6400,0.0271,0.4773],"specular":[0.5000,0.5000,0.5000],"specularPower":50.0000,"emissive":[0.0000,0.0000,0.0000],"alpha":1.0000,"backFaceCulling":true},{"name":"Material.003","id":"Material.003","ambient":[0.8000,0.7543,0.0833],"diffuse":[0.6400,0.6034,0.0667],"specular":[0.5000,0.5000,0.5000],"specularPower":50.0000,"emissive":[0.0000,0.0000,0.0000],"alpha":1.0000,"backFaceCulling":true}],"meshes":[{"name":"Cube","id":"Cube","materialId":"Material.002","position":[-0.1417,0.6998,3.2061],"rotation":[0.0000,0.0000,0.0000],"scaling":[1.0000,1.0000,1.0000],"isVisible":true,"isEnabled":true,"checkCollisions":false,"billboardMode":0,"uvCount":0,"vertices":[-1.0000,1.0000,-1.0000,-0.5773,0.5773,-0.5773,-1.0000,-1.0000,1.0000,-0.5773,-0.5773,0.5773,-1.0000,-1.0000,-1.0000,-0.5773,-0.5773,-0.5773,-1.0000,1.0000,1.0000,-0.5773,0.5773,0.5773,1.0000,-1.0000,1.0000,0.5773,-0.5773,0.5773,1.0000,1.0000,1.0000,0.5773,0.5773,0.5773,1.0000,-1.0000,-1.0000,0.5773,-0.5773,-0.5773,1.0000,1.0000,-1.0000,0.5773,0.5773,-0.5773].... I know I am doing something stupid, please help.
  13. Can we set lines as dashed in grids lines. I am using below code: var gridBox = BABYLON.MeshBuilder.CreateBox("box1", { width: objectProperties.width, height: 0.05, depth: objectProperties.height, updatable: true }, scene); var defaultGridMaterial = new BABYLON.GridMaterial("default", scene); defaultGridMaterial.majorUnitFrequency = 2; defaultGridMaterial.gridRatio = 2; gridBox.material = defaultGridMaterial; gridBox.material.diffuseColor = new BABYLON.Color3(1, 2, 0);
  14. Hi Team, I am working on an editor for room planner using babylon js. I am storing some custom properties for few of the meshes in my scene. shearWall.maxXPos = maxXPos; shearWall.minXPos = minXPos; These properties are having their use for dragging. there are other properties as well. each one of it having its own purpose. I need to save all the data and store it in database. so that user can revisit and work from where he have left the design. to export the data, i am using: var serializedScene = BABYLON.SceneSerializer.Serialize(scene);var strScene = JSON.stringify(serializedScene); The issue is, the custom properties set are not part of json data above. Is there a way to store the custom properties which becomes part of serializer above?
  15. Hi I now have two problems I have a scene to see the picture 1.On the phone side, the whole scene becomes very vague, probably because the scene and the camera is too far away, I want to solve by camera.fov, but does not work 2.On the phone side of the GUI created by the dot, will bumpy scrolling Hope to give suggestions thank you very much
  16. Can you use image mapping with babylon, I want to overcome the clickable area issue with transparent backgrounds on sprites, if anyone knows the answer please let me know! Also if anyone knows of any playgrounds or could a playground for me that would also be even better!
  17. Hello everyone, I'm trying to get my head around how to work with animations in Blender and Babylon. I have no trouble exporting/loading etc and my animations works except in one aspect. I have added some movements to my object in Blender and with movement I mean that my object changes position. My problem now is that if I "walk" with my object in the browser each animation will begin where the object is added during the initialization. I have tried to find some data giving me the new position of the object when one animation is finished. Problem seems to be that the position of the object (mesh) doesn't actually change during the animation even though the object "moves". Does anyone have any suggestions of how to solve this issue? Or aren't you supposed to change position in Blender, only make animations where the object stays in the same spot all the time? Just seems strange if that would be the case...
  18. Hi I would like to watch the skybox in the vr camera, skybox which need to trigger an event to switch skybox. I want to add a mesh in the middle of the screen, he will not move with the deformation, and always in the middle of the screen, it plays the role is equivalent to the mouse trigger click event I hope you give suggestions, or demo thank you very much
  19. Hi, An interpretation of Picasso's Guernica; my tribute to you Frenchmen! Press "Start Animation".
  20. 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
  21. 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!
  22. Hello all, I apologize in advance if this question has been asked and answered N times already, but I have searched through the forums, and slogged through the vastness that is Google, and haven't quite come up with an opinionated-enough answer that influences my desires. My (simple) question is this: What is my best option for implementing UI elements in a Babylon.js-based web game? My (more complex) question is: Given that I want to provide (1) performant (2) support for responsiveness (handheld, tablet, computer) in a user interface which (3) allows for things like multiply-layered (e.g. controls over render-texture over background) UI widgets, (4) text rendering similar to DOM capabilities, that (5) integrates well with Babylon.js, and (6) is currently supported/actively developed, what are my actual options? (1) my options are DOM (slow), canvas (better) and WebGL (best) (2) can be influenced by media query-alikes in order to support different devices (3) not sure, this sounds like custom witchcraft (4) why not just use DOM?? (5) bGUI :-) (6) Not bGUI :-( I've built a UI library in the past, so the concepts are not foreign to me. But since I'm in the research phase for my own project, I figured I would reach out to the BJS community, and perhaps spark an A vs. B flame war. (Kidding!) Any thoughts are welcome, so please fire at will
  23. Hi guys, I'm trying to make 2D-shapes / 2D-sprites in my Canvas2D (ScreenSpaceCanvas) follow some sprites which are placed in my 3d world. For this, I'm using the BABYLON.Vector3.Project function as followed: However, this is the result: I've checked each of the arguments and they all contain valid values at the time of being called. I've also stumbled across this topic, which uses another 4th argument in the call, but I've had no luck trying it with that one either. Any ideas? Thanks in advance!
  24. Hi, I thought I would ask before coding functions for which I'm not certain babylon.js already supports. Is there a ready method that can take a single obj/mesh that consists of several contiguous meshes and parse the contiguous meshes into, say, an array ? I have attached an example of a hex tile terrain (see attached) exported from blender which consists of 50 hex tiles. If possible, I'd like to simply pass the hex terrain data and obtain all the 50 hex tiles in an array. Which I can then use mouse triggers on and so forth. I have read the doc and done some testing but cannot seem to get the behaviour I wanted with subMeshes. Does another method/function exists that can do the job? Or do I have to code my own by parsing the babylon file ?
  25. I have been working tirelessly with this and really struggling to get anywhere, if anyone can offer some form of assistance I would be greatly appreciative. I have essentially set up a reel of characters (staff) as sprites organised by co'ords in three circles, 12 characters per circle, around the camera set at (0,0,0), (Radius of circles are 1.5/1.45/1.4 I have a scene built currently which is super buggy in movement as well. I need it to when the mouse hovers on the left or right side of the screen to rotate the camera continuously scrolling through the images on loop (Cant get working past following the mouse - no loop - no smooth movement as mouse movement on y axis also rotates the camera. This is my mouse movement code: var mouse = {x:0,y:0}; var cameraMoves = {x:0,y:0,z:-0.1,move:false,speed:0.03}; function mouseMove(e){ mouse.x = e.clientX; mouse.y = e.clientY; camera.rotation.x += Math.max(Math.min((e.clientX - mouse.x) * 0.01, cameraMoves.speed), -cameraMoves.speed); camera.rotation.y += Math.max(Math.min((e.clientY - mouse.x) * 0.01, cameraMoves.speed), -cameraMoves.speed); The second main issue i'm having is that the sprites keep disappearing when rotating the camera, I'm trying to create a constant panable image reel from inside to view members of staff, there is an example i'm trying to follow and recreate found here: If anyone could tell me how to solve me mouse hover to move issue (with infinite looping) or a fix for the rendering of sprites issue it would be great! If anyone thinks they can help and needs any more code of any kinds just let me know and i''ll sort it! Thanks!