Search the Community

How does one structure a humanoid mesh and then use it within babylon such that one can ray pick isolated body parts as they move through animations? Does one just leave each body part as a separate object in blender..? How will pickResult tell me that a ray traveled through the right hand? Currently the character is 11 separate meshes and animated completely in javascript, which makes the picking work just fine but is non-desirable for adding animations :D. Also not sure about the performance ramifications

Hi there, learning Babylon.js since 2 days I've created a "container" mesh (with no geometry), and then added to it 2 children meshes, a box and a sphere. I would like to pick the container mesh on mouseClick event, but actually either box or sphere get selected. Is there a way to ignore submeshes? I know there would be many workarounds, like for example creating the container as a box with a transparent material, but I was just wondering if there was a flag/parameter a can set when doing raycasting. Here you can find the PG: https://www.babylonjs-playground.com/#BD4L6U

Hello all Sorry for my bad english in advance . I have a littel issue with GUI and I want to understand why it works like taht . What is the issue ? I made this function : function vecToLocal (vector, mesh){ var m = mesh.getWorldMatrix(); var v = BABYLON.Vector3.TransformCoordinates(vector, m); return v; } class Raycast { constructor() { } doorOpener(letHit, myGUI, scene){ this.scene = scene; var origin = player.position; var forward = new BABYLON.Vector3( 0, 0, 1,); forward = vecToLocal(forward, player); var direction = forward.subtract(origin); direction = BABYLON.Vector3.Normalize(direction); var length = 1.5; var ray = new BABYLON.Ray(origin, direction, length); var hit = this.scene.pickWithRay(ray); if (hit.pickedMesh == letHit){ if (control.keys.ePress == 1){ scene.beginAnimation(letHit, 0, 40, false); } return myGUI.isVisible = 1 }else { return myGUI.label.isVisible = 0; } } } This function is responsible to opening doors. When player reach a door then GUI shows up which key(E) on keyboard must be pressed for open the door but the GUI only works whith one door . Here is how I call Raycast function : const view = require('./ray.js'); const panelG= require('./gui.js'); class Leves { constructor(scene,camera,followCam,canvas) { this.scene = scene; GuiP = new panelG.GuiP (scene); doo = new view.Ray (); BABYLON.SceneLoader.ImportMesh("", "textury/mapy/", "lvl01.babylon", this.scene,function (newMeshes) { var level_001 = newMeshes[0]; level_001.checkCollisions = true; var door = newMeshes[1]; door.checkCollisions = true; var door2 = newMeshes[2] door2.checkCollisions = true; var openDoor = new BABYLON.Animation("t", "position.z", 25, BABYLON.Animation.ANIMATIONTYPE_FLOAT, BABYLON.Animation.ANIMATIONLOOPMODE_CYCLE); var keys = []; keys.push({ frame: 0, value: 0.45 }); keys.push({ frame:5, value: -1.5 }); keys.push({ frame: 10, value: -3 }); keys.push({ frame: 30, value: -3 }); keys.push({ frame: 35, value: -1.5 }); keys.push({ frame: 40, value: 0.45 }); openDoor.setKeys(keys); door.animations.push(openDoor); door2.animations.push(openDoor); scene.registerBeforeRender(function () { doo.doorOpener (door, GuiP.panel, scene ); /*only animation works*/ doo.doorOpener( door2, GuiP.panel, scene); /* GUI and animation works very good */ }) }) } } I am newbie in babylonjs and javascript too and I want to understand every aspect of babylon js and javascript.

Hello I found one bug I think. In this exampel https://www.babylonjs-playground.com/#KNE0O#4 I found this example o https://doc.babylonjs.com/babylon101/raycasts ray.show(scene, new BABYLON.Color3(1, 1, 0.1)); When I tried this code, which was prepared in exampel then babylon.js stop worked. Sorry for my poor english.

Hello everybody, I'm currently trying to get a mesh by clicking on the canvas. So far, it works really great but I still have a problem: On click, the mesh gets highlighted. Fine but when I drag the mouse on the canvas in order to move the cam, when I release the button of the mouse, a click event is triggered and the mesh beneath it get selected. I tried to add an event listener on 'mouseup' to stop propagation to the click event but it seems BJS already "intercepts" this event so it is never triggered. I created a codepen to illustrate : https://codepen.io/3dos/pen/mLEEdq On the left is an empty canvas on which the mouse events are triggered. On the right is a babylon canvas on which the mouseup event is not triggered. Is there a simple way to avoid selecting meshes on drag ? (also tried the dragend event with no success either) Thanks to everybody who already helped me PS: I joined a screenshot of the console illustrating what I'm telling (did the exact same actions on the 2 canvas)

when i create and use raycast in my scene it is in not in exact position means the below code is i'm using. based on the code the ray can be in straight line towards z axis but it is inclined var front = new BABYLON.Ray(); var frontHelper = new BABYLON.RayHelper(front); var frontLocalMeshDirection = new BABYLON.Vector3(0, 0, 500); var frontLocalMeshOrigin = new BABYLON.Vector3(0, 0, 1); var frontLength = 3; frontHelper.attachToMesh(this.__this.player, frontLocalMeshDirection, frontLocalMeshOrigin, frontLength); frontHelper.show(this.__this.scene);

Hi, when using var hitInfo = scene.pickWithRay(ray, null, true); I would expect that the ray only checks the boundingboxes and not the mesh. So if I import an "open package" where the ray can go through the object without collision, I want to check only if the ray hits the boundingbox, but this doesn't seem to work. Here is a playground: http://www.babylonjs-playground.com/#5PMLFP Thanks, Steffen

Hello, Raycast TerrainMap and get MixMap %'s? CONTEXT: Raycast over a Terrain Map... and determine the type of terrain (floor, rock, grass, etc) where the Ray Intersects mesh. Looking at Mixed-Map-Materials and Facet-Data... QUESTION: is there a way, to get the MixMap through a Raycast Intersection? Or any suggestions on detecting floor, rock, grass... thx. Kind regards, UPDATE: using this playground, stepping into raycast... http://www.babylonjs-playground.com/#7CPS7 Found: results[0].pickedMesh, pickedPoint, collisionGroup, looking around... : ) .subMeshes.materialIndex?... DEMO-TEST: fork Multi-Map playground and add the touch raycast. : ) Worked perfectly - Clickable Multi Map playground (debugger on cast): https://www.babylonjs-playground.com/#E6OZX#7 looking around... AbstactMesh.collisionGroup? faceId? UPDATE: idea of how to do this, need to get the mixmap.png rgb at the location of the getTextureCoordinates()...greatest intensity wins. And... looks like Context2D can do that... (perhaps) https://www.babylonjs-playground.com/#1UCP5L#5

Hey guys... got a couple of quick questions about raycasting... 1... Is recasting an 'Expensive Thing' for BabylonJS. I ask because in unity, a fully scripted player character might by casting 6 - 10 rays on each frame... One ray might be be checking ground distance... Four separate rays might be casting to the four near clip plane points of the camera to check for Collision and or occlusion and one ray might checking wall distance ... and so on... Now that apparently is FINE in Unity on a native platform... Would that many rays be TOO MUCH for a BabylonJS Game... ??? 2... Is is possible to create a "Sphere Cast" type functionality like Unity Has... Example: Physics.SphereCast public static bool SphereCast(Vector3 origin, float radius, Vector3 direction, out RaycastHit hitInfo, float maxDistance = Mathf.Infinity, int layerMask = DefaultRaycastLayers, QueryTriggerInteraction queryTriggerInteraction = QueryTriggerInteraction.UseGlobal); Parameters origin The center of the sphere at the start of the sweep. radius The radius of the sphere. direction The direction into which to sweep the sphere. hitInfo If true is returned, hitInfo will contain more information about where the collider was hit. (See Also: RaycastHit). maxDistance The max length of the cast. layerMask A Layer mask that is used to selectively ignore colliders when casting a capsule. queryTriggerInteraction Specifies whether this query should hit Triggers. Returns bool True when the sphere sweep intersects any collider, otherwise false. Description Casts a sphere along a ray and returns detailed information on what was hit. This is useful when a Raycast does not give enough precision, because you want to find out if an object of a specific size, such as a character, will be able to move somewhere without colliding with anything on the way. Think of the sphere cast like a thick raycast. In this case the ray is specified by a start vector and a direction. Notes: SphereCast will not detect colliders for which the sphere overlaps the collider. Passing a zero radius results in undefined output and doesn't always behave the same as Physics.Raycast. See Also: Physics.SphereCastAll, Physics.CapsuleCast, Physics.Raycast, Rigidbody.SweepTest. using UnityEngine; using System.Collections; public class ExampleClass : MonoBehaviour { CharacterController charCtrl; void Start() { charCtrl = GetComponent<CharacterController>(); } void Update() { RaycastHit hit; Vector3 p1 = transform.position + charCtrl.center; float distanceToObstacle = 0; // Cast a sphere wrapping character controller 10 meters forward // to see if it is about to hit anything. if (Physics.SphereCast(p1, charCtrl.height / 2, transform.forward, out hit, 10)) { distanceToObstacle = hit.distance; } } } Yo @Deltakosh ... Gotta ping you in here ???

Hello, Looking into the particle system, http://doc.babylonjs.com/overviews/solid_particle_system, Wondering... Can particles be detected with raycast? When trying this: var hitInfo = ray.intersectsMeshes(particleArray); Gets error: i.getWorldMatrix is not a function, and I see why... Tried: {isPickable: true}, same result. Guess: attempting to draw a line and use intersectsMesh()... Would that be a good approach, or other suggestions? UPDATE: drawLines(), dispose() and intersectsMesh() did work. Still open to other ideas.

My character fires a bullet and how far it goes depends on what it hits or passes through. Box2D and other physics engines have useful callbacks for collision detection for moving objects, but this bullet would be rendered instantaneously so I figured raytracing would be the solution. How would I go about doing this?

Hi all, Having started with Phaser a few days ago, I can't find any example or documentation about raycasting. So, to explain what I'm after: For a simple platformer, I have a character that's shooting at enemies. But, I don't want the bullets to be objects (sprites), because of the fast speed (the collision check might fail). So I thought about using raycasting, and have the first enemy in the line of sight take damage. Or, in some case, every enemy in the line of sight (until a specific tile is hit, the end of the world is reached, or a specific distance). The ray is always horizontal, so that should help a bit. Also, the ray might not pass through the sprites center, as some sprites are larger, some smaller, or the enemy is moving up/down/jumping. I checked the "Tilemap Ray Cast" example, which is exactly what I'm trying to achieve, but it works with tiles, and I need it to work with objects (sprites). From the source code, http://docs.phaser.io/TilemapLayer.js.html#sunlight-1-line-384 , it loops through all the tiles and checks every coordinate. Taking reference from TilemapLayer.getRayCastTiles, I managed to get it correctly using this code: rayPoints = ray.coordinatesOnLine(15); //15 is because enemy sprites are 16px widefor(var i=0; i<enemies.length; i++){ if(enemies[i].inCamera && spriteContainsPoint(enemies[i]) ){ enemies[i].tint=0x00ff00; }else{ enemies[i].tint=0xffffff; }}function spriteContainsPoint(){ //function which checks if the coordinate is inside the body of the sprite}but I feel it is quite inneficient, as it loops through every enemy sprite and checks if it is inCamera and it's bounds. A more efficient way would be the other way around: check if there is a sprite at a given coordinate: rayPoints = ray.coordinatesOnLine(15); //15 is because enemy sprites are 16px widefor(var i=0; i<rayPoints.length; i++){ checkForSpritesAtPoint(rayPoints[i][0], rayPoints[i][1]);}function checkForSpritesAtPoint(x, y){ //return array of sprites at given point, without looping through all}This way I will also get the enemy sprites ordered by distance (closest to furthest). Can this be achieved (layers, physics, magic ...)? So, in short, what I need is a way to get every sprite that a line passes through, sorted by distance to the player (without checking all the enemies in the world, and every pixel they occupy). Any ideas?

Hi, I'm started to port an Box2dWeb/CreateJS prototype game to Phaser (just to test and compare). With Box2dWeb I was able to do a dynamic shadow for a 2D game plateform with a raycast like this : Is it possible to do same compute with the actual physics system ? I see on github that on next major release "Integration with an advanced physics system. We've been experimenting with p2.js but have yet to conclude our research.". I found nothing about raycast with p2.js, but may be it is in your experimentation ? Anyway congrats for phaser/pixi.js, always cool to see/test new tools

"Time Flies Straight" a non-usual game of fractal time, Starring Carl Sagan. This was my entry for Ludum Dare 27 - a Wolf3D raycast-style adventure game. Wander the maze of fractal time searching for a precious few seconds to finish your quest. The game was pretty well received in the comp (ended up placing 23rd overall, which I was really happy about) and also got covered on a bunch of outlets - pcgamer.com, indiegames.com, and best was Indie Impressions - where the video got, like, 4000 views. Pretty cool! It's more of an "experience" than a game - certainly suffers from limited replayability... but I overall I was pretty happy with how it turned out. I think its the first game I've made where people spent more time playing it (collectively) than I spent coding it I had a lot of plans for more game elements, but ran out of time (48 hours is not long, it turns out!).