Search the Community

Hey all! I am both new to Babylon and these forums! I want to make a First Person Camera that moves in a direction based on its rotation (e.i. like a forward/backwards functionality with W/S). Only problem is I don't know how to do this without maybe physics engines enabled or making a bunch of really janky movements. I want something like Unity's Transform.forward. How do I achieve this?

Hi Forgive me if I've missed this, but I can't find it in any of the documentation. Is there a way to specify the the rotation of an arcade physics body? I can rotate the game object image, but that has no effect on the physics body. I would have expected a .setAngle or .setRotation method to be available on Phaser.Physics.Arcade.Body. Seems such a simple one to miss, but I keep needing this and having to use matter, which is just a little more fiddly. Thank you!

I was unable to transform mesh instance if the original mesh had a shader material. Is this a bug? I have created a playground example using box mesh. If you open the debug -> mesh panel, you realize there are 6 meshes, but only 5 are displayed. This is because one of the instances in the second row was not transformed properly. On the other hand, clones of meshes with shader material can be transformed properly. https://playground.babylonjs.com/#B2NZ1M#1

Hi, I want to create a ground mesh from a plane. let plane = new Plane(-0.4, -0.2, -0.6, 0.1); //normal and offset let planeMesh = Mesh.CreateGround("planeMesh", 100, 100, 2, scene); //to make the planeMesh to fit the plane, transformation should be added to the mesh planeMesh.rotation = ... planeMesh.positon = ... someone can help me out? Thanks.

Disclaimer: I know this sounds nooby af, but I don't even know how it's called what I want and I do not search for a solution, I search for ideas.(: Maybe you guys played Hearthstone, or any other card game. When you pick up cards from your hand, they do some wobbly fx (<- I'd appreciate to get to know how to call this shit.) because the card has some elastic physics to it. My first idea to do this would be using pixi-projection with some easing to it. But then the question is what to apply with easing to let it look right and not completely fucked up?^^ I guess the scaling should to have some easing to it and the 4 corners need to "spread out" with different speeds? The next thing I thought about where displacement maps. But tbh, I have no idea how this black magic works and how to apply it doing some animated stuff. Please don't be like "oh you rookie..." - I know I am. Please don't be like "heres code: ..." - I want to know what I'm doing pls. Please be like "this is an interesting resource: <link to interesting resource>". Love.?

In unity they have transform.forward, right and up. The docs for unity say the forward is : 'The blue axis of the transform in world space.' using UnityEngine; using System.Collections; public class ExampleClass : MonoBehaviour { public float thrust; public Rigidbody rb; void Start() { rb = GetComponent<Rigidbody>(); } void Update() { rb.AddForce(transform.forward * thrust); } } How would I do this in Babylon.... Yo @Deltakosh or ANYBODY How do we get the forward vector in Babylon... Would this work: /** The blue axis of the transform in world space. */ public static GetForwardVector(mesh:AbstractMesh, force?:boolean):BABYLON.Vector3 { var matrix:BABYLON.Matrix = mesh.computeWorldMatrix(force); return BABYLON.Vector3.TransformCoordinates(BABYLON.Vector3.Forward(), matrix); } /** The red axis of the transform in world space. */ public static GetRightVector(mesh:AbstractMesh, force?:boolean):BABYLON.Vector3 { var matrix:BABYLON.Matrix = mesh.computeWorldMatrix(force); return BABYLON.Vector3.TransformCoordinates(BABYLON.Vector3.Right(), matrix); } /** The green axis of the transform in world space. */ public static GetUpVector(mesh:AbstractMesh, force?:boolean):BABYLON.Vector3 { var matrix:BABYLON.Matrix = mesh.computeWorldMatrix(force); return BABYLON.Vector3.TransformCoordinates(BABYLON.Vector3.Up(), matrix); } Also I saw some c++ code for getting forward vector using the quaternion, could I use this in babylon or SHOULD I even try use in Babylon ... Is there something already in Babylon for this: Vector3 Quaternion::GetForwardVector() const { return Vector3( 2 * (x * z + w * y), 2 * (y * x - w * x), 1 - 2 * (x * x + y * y)); } Vector3 Quaternion::GetUpVector() const { return Vector3( 2 * (x * y - w * z), 1 - 2 * (x * x + z * z), 2 * (y * z + w * x)); } Vector3 Quaternion::GetRightVector() const { return Vector3( 1 - 2 * (y * y + z * z), 2 * (x * y + w * z), 2 * (x * z - w * y)); } Or am I way off

How to create Empty Mesh/Node for Parenting? The Empty Node must have Position, & other Transform data!

Hello. I want to make Sprite size (width, height) transform independent (constant sprite size). What I mean is whenever I change transformation matrix it should apply for coords, but not the size of the sprite. I've been looking into sources and found 2 ways to do that, but I don't like neither of them. 1) Different containers: Right now I change main container's (stage) matrix and it applies for all children in it, which is great, but not in my case. I can split objects that I want to be scale size independent into another container and only sync translation, which is a bit odd to me, because I still want the transform for this container (for coords). 2) Not sure if it will work: whenever I change main container's matrix, for every object that I want to make scale independent, change worldTransform (a, d) to 1. But I think it will break the coords. Is there a good way to achieve this?

So if I have a ground plane, and am looking to manipulate the vertex data but need the values to be updated to their correct position after a rotation and transform that I applied. http://www.babylonjs-playground.com/#DPSB16#3 Is the playground showing the creation and manipulation of the mesh. Basically what I need to happen now is when I grab the VertexData the points will have the rotation and transformation applied. I have a good idea of how to do it manually with some vector manipulation but would like to just "bake" this information then grab it instead of doing a multiple steps.

Good day to all! I have a question on Phaser's world-to-screen transformations, and I've googled almost nothing on it Is there a way to transform a sprite's world coordinates into the screen space (and visa versa)? It is a very useful feature and I can't beleave nobody still interested in it! I found poor documented Sprite.worldTransform.tx, Sprite.worldTransform.ty,but I'm not sure these fields always work properly (to be honest, I am sure they don't). Thank you!

Hi. Im fairly new on Pixi and im trying to do something with multiple renderers. I know i could add multiple canvas instead, however i need a dedicated webgl renderer to manipulate the transform and try to do some trapezoid forms. I also need both renderers to works on the same canvas to avoid creating multiple layers on the document.body. My approach was: 1. Have a main renderer and a main stage. 2. Have a sideRenderer that will be affected by different transforms (using gl.uniformMatrix4fv to change the shape of the whole renderer and achieve different shapes) and a sideStage that will hold any content (in this example, a simple sprite). 3. make the sideRenderer render to a RenderTexture, which will be the source of a Sprite, which will be added on the main stage. So in theory, anything that the side renderer renders to the RenderTexture should appear on the sprite on the main stage. If somehow i modify side renderer, the transformed output should be shown on the RenderTexture, if that makes any sense. I tried this with this example, and it doesnt works. If i append the sideRenderer.view to the document.body, it renders as expected, but its not what i want, as i need it to be part of a more complex logic. At some point this makes me realize that i cannot mix renderers like this ( maybe the sideRender is still working on the back while the mainRender is trying to render an incomplete RenderTexture ? ), cannot make one renderer render something for another renderer (sideRenderer to mainRenderer or viceversa), so i would like to know if there is any workaround or any way to override this behavior? Thanks for the help var renderer = null; var sideRenderer = null; var stage = null; var sideStage = null; var WIDTH = 1000; var HEIGHT = 500; var rt = new PIXI.RenderTexture( 1000, 500 ); var spriteRt = new PIXI.Sprite( rt ); init(); function init() { var rendererOptions = { backgroundColor: 0xffffff, transparent: true } // Create the renderer renderer = PIXI.autoDetectRenderer( WIDTH, HEIGHT, rendererOptions ); sideRenderer = PIXI.autoDetectRenderer( WIDTH, HEIGHT, rendererOptions ); // Add the canvas to the HTML document document.body.appendChild( renderer.view ); // Create a container object called the `stage` stage = new PIXI.Container(); sideStage = new PIXI.Container(); stage.addChild( spriteRt ); var loader = PIXI.loader; loader.add( 'texture', './media/crate.png' ); loader.once( 'complete', onLoadedAsset ); loader.load(); } function onLoadedAsset() { var texture = PIXI.Texture.fromFrame( './media/crate.png' ); var sprite = new PIXI.Sprite( texture ); sideStage.addChild( sprite ); update(); } function update() { sideRenderer.render( sideStage, rt ); renderer.render( stage ); requestAnimationFrame( update ); }

It seems that Sprite.getBounds returns camera-relative coordinates. The docs say "Returns the bounds of the Sprite as a rectangle. The bounds calculation takes the worldTransform into account" which would indicate to me that they give world coordinates. However, looking at the code a bit, it seems that in a simple game you might have the hierarchy: Stage -> World -> Group -> Sprite And if the camera is at position (100,100), then that means the World's transform is at (-100, -100). Then, when getBounds is called on the sprite, it traverses its parents, accounting for all transforms, and thus the camera's (-100, -100) is included. Is this a bug? At least in the documentation? I can work around it easily enough (add the camera's coords to what getBounds returns), but it made me pull some hair out (: I'm using Phaser 2.4.4 Here's another forum post about the same issue, FYI:

When transform is added to parent, it's also added to children right? In some case I don't want this - I want to control my self, how children reacts when parent transform is changed. Can I do that? Any advice?

Hello, As a frame of reference, in Helix Toolkit for WPF (C#, .NET), I am calculating and rendering some coordinates to model a football Goal Post, or pylons at the end zone corners if you prefer. I want to start with a single set of coordinates, and apply a transform that basically mirrors those coordinates on either end of the field, end zone, or what have you. This is extremely easy to apply using the WPF view XAML. Let's say I have the points for the post; 180 feet from either end of center field (Z axis): // assuming "world" coordinates originate at center field, measured in feet // that's 50 yards plus 10 for the end zone; post height is 6 feet. var points = [new BABYLON.Vector3(0, 0, 180), new BABYLON.Vector3(0, 6, 180)]; After that, I would CreateTube, let's say, to actually model the object. But for right now I just want to mirror about the Z axis. The modeling bits are beyond the scope of this question, unless they aren't. My transformation vector would be something like this, I think, but I could be wrong: new BABYLON.Vector3(0, 0, -1). Similar case for the uprights; 18.5 feet wide about the X axis: var points = [new BABYLON.Vector3(9.25, 10, 180), new BABYLON.Vector3(9.25, 40, 180)]; My transformation vector would be something like new BABYLON.Vector3(-1, 0, 0). Are there utilities in BABYLON that can facilitate such a transformation? Might do a similar thing for additive transformations, as contrasted with multiplicative, in this case. Thank you... Regards, Michael Powell

Hello, I want to use setTransform method of canvas in pixijs. Is there any interface in pixijs to apply this concept. I have tried implementing like this: displayObj.localTransform = [1, 1, 1, 1, 0, 0]; but its not working. Please suggest. Thanks vbh

I have an animated character scene that has an animated, rigged, skinned mesh for the character and some other rigged meshes for equipment. Babylon doesn't like how the equipment is animated when I export from 3dsmax to Babylon it doesn't animate the equipment meshes. I'm not sure whats special about the equipment meshes I think they are transforms? Here is a video of the animation rendered from 3dsmax: Here is a video of the animation exported to Babylon: I'm not sure whats going on here I got the model from a 3rd party and animation is not my skill set. Heres a closer look at one of the helmet meshes that should be animated. The modifiers are Xform, Material, Symmetry, Editable Poly. Hopefully someone can explain why this is broken and if I can fix it. Or what the proper way is to handle these animations.

Hi, I am using Phaser with TypeScript and encountered some strange behavior: If I create some shape objects and change the position of one of them, the new position is applied to it (relative to the initial position) and to all other objects as well. I want to change the position of only one object, not all. How can I achieve that? here is some code for testing: class Main { game: Phaser.Game; graphics: Phaser.Graphics; constructor() { this.game = new Phaser.Game(800, 600, Phaser.AUTO, 'content', { create: this.create }); } create() { this.graphics = this.game.add.graphics(0, 0); this.graphics.lineStyle(5, 0xffffff); var circle1 = this.graphics.drawCircle(0.5 * this.game.width, 0.5 * this.game.height, 400); var circle2 = this.graphics.drawCircle(0.5 * this.game.width, 0.5 * this.game.height, 200); // this line shifts both circles. But why? circle1.position.set(100, 100); } }window.onload = () =>{ var game = new Main();};PS: it seems like the radius parameter of the drawCircle() method expects the diameter instead of the radius...

Hello, I'd like to know if there is a method to calculate the position and the rotation from a transform matrix. In my case i calculate a transform matrix and i want to apply it to my mesh. I tried mesh.setPivotMatrix but i don't want to move the pivot, i want to move the mesh. So i have to move my mesh with mesh.position and mesh.rotation. It changes the worldmatrix of my mesh and i want this new worldmatrix equal to my transform matrix. That's why the function setWorldMatrix could be the theoretical solution of my issue. Thanks

Hi, I got my sprite, who is 58 x 74 and i set it body at this.sprite.body.setSize(30, 63, 6, 11);It's a character, so when i press the left button i scale it at -1 in X. But i don't know how i can adjust the body size. There's a screenshot of both position, how can i adjust the left one? Thank you