Search the Community

Hi, I need help to discuss an issue about merging together two defferent textures - one contains RGB data and is in JPG format, another contains only information about the alpha channel and is in PNG format. We now use an approach where a canvas element is created, the we first draw the alpha texture and use "source-in" composite operation (https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation) to draw RGB texture on top. Due to an error with Apple devices, when creating multiple canvas elements one of them is returned as undefined. Is there any way I can combine these textures while not using a canvas? I prepared a simple demonstration of the process here: https://playcode.io/1734929

Hello! I am using pixi 5.3.3v and i am trying to create bitmapfont with the method 'from'. As i log the newly create font, it seems that it always creates the same set of symbols, even when i try to set chars to somethings else. The other problem is that the default created chars, does not contain any special symbols like "!,.@". Thanks.

Hello, I am trying to imitate a rotating part (a.k.a. "windmill" please see this youtube video) using the Matter physics engine's constraint. I have tested a body shape made with PhysicsEditor and that of simple image shape (just a thin rectangle). The windmill made with PhysicsEditor keeps on rotating and it does not seem to stop until you give another collision to the body. Here is a codepen to demonstrate. https://codepen.io/BeFiveINFO/pen/EdQgdq Please try pressing space key for a second. Is there any way to control the behaviour of the body shape made with PhysicsEditor? Thank you for your help in advance!

Hi guys, I have been struggling with the text alignment within a container in order to create a bubble dialog box. I create a container, add graphics inside and then text. However I cannot understand how to have the text centered within the container. I saw in an old post something like label.setOrigin(0.5); which do no work in this case. Here is the result on Chrome followed by the result on a mobile device (emulated with Chrome, just for information) Since more code is always better, I isolated this particular example in the Bubble-sample.zip file attached Just run "npm install" and "npm run start" then go to http://localhost:8080/ and click in the canvas. I'm looking for a global solution that would center some text within a container, independently of the number of lines, I'm certainly missing a big concept here... ? Bubble-sample.zip

It's like selecting multiple bones in blender and then adjusting the overall position and rotation。

Hi guys, I'm a TypeScript user. I saw the source code of ArcRotateCamera, _bouncingBehavior is private and bouncingBehavior is readonly. How to set the values of transitionDuration, lowerRadiusTransitionRange, upperRadiusTransitionRange, autoTransitionRange? FramingBehavior and AutoRotationBehavior as well.

Hi, I have three button on the GUI interface, I mainly want to implement a game handle, a button says "fire", the other two buttons said "direction", now the problem is, when I press the two buttons at the same time, "onPointerDownObservable" event is executed correctly, but "onPointerUpObservable" event only carried out the last of the button, how to set up a web page or other parameters? thinks！！！

Hi ! I want to move a project from three to babylonjs, and I have the following problems. The material of the model is shown correctly in threejs and 3dsmax, only in babylonjs.

I set the mode to ORTHOGRAPHIC_CAMERA and wanted to move it around. This I thought would be easy just set the rotate.y to spin it or position.y to zoom in and out but I was wrong. I rotated the camera 90 degrees in the X axis to have a top down view. And what I see rendered doesnt make any sense. The sphere is oblong. You rotate the image (use shift Left or right arrow on the keyboard) and it keeps that the oblong view facing up. Another question is why is the rotational center so far off? Where is the axis? Here is some code to look at. https://www.babylonjs-playground.com/#21YCLG#17 To move around use keyboard Left arrow right arrow Up arrow down Arrow movement and shift left arrow and right arrow to rotate. Mouse wheel for zoom in and out.

Hi Everyone, I have basically 2 queries: 1 - What is the format and parameters to give MirrorPlane details inside babylon Binary file? (Material has tags called "isRenderTarget", "renderTargetSize", "mirrorPlane", "renderList", so I presume by giving proper values here I can get it working) 2 - How can we convert .babylon to Binary version and viceversa? The reason I am asking these questions is, I use 3DS Max and find it difficult to get certain features(like mirror material) working. Hence, I want to edit/add the properties inside the babylon file. Though I can access these in HTML, I don't want to expose these changes.

A weird problem again... a repro can be seen here: https://www.babylonjs-playground.com/#0A74HT. Playing this PG on android chrome, or desktop browsers, you will each character doing a different animation. However if you play this on iphone, all characters will be playing the exact same animation always. Any theories?

During a recent profiling we found that a Scene object is being retained in the heap infinitely even if dispose is called. Apparently the Engine keeps an array of compiledEffects which then has fallback meshes that keep a reference to the scene and that prevented the scene object from being garbage collected. Is this expected? There's about 9MB of stuff that can be wiped out from our pathetic mobile device memory, so definitely hoping there's a way to collect it.

I'm not sure if this is intended or it just isn't able to, but the GridMaterial currently doesn't seem to support shadows. I've tried different methods, but with no luck. Using an example of the BabylonJS shadow tutorial moving the ground into a grid shows this problem clearly; https://www.babylonjs-playground.com/#Y5IZCF#2 It would be awesome if the GridMaterial could support this as it provides a efficient way to render a high scale grid performance wise.

Hi all! I pressed mouse to a Button and keep mouse, after move mouse outside bounding Button and released mouse. I would like receive an event here (ex PointerUpOutSide). How to do this? Thanks all! -- Bad illustration

Hi @all again, I have a question: I want to remove a bulletMesh (bullet) with the dispose function if it collide with something like bullet.physicsImpostor.onCollideEvent = function (self, other) { console.log(self, other, self.position); self.object.dispose(); }; Got an Error: Uncaught TypeError: Cannot read property '_wakeUpAfterNarrowphase' of undefined at World.internalStep (cannon.js:13514) at World.step (cannon.js:13211) at CannonJSPlugin.executeStep (babylon.max.js:45178) at PhysicsEngine._step (babylon.max.js:36315) at Scene.render (babylon.max.js:21270) at main.js:847 at Engine._renderLoop (babylon.max.js:8509) What do I wrong? Ho can I do this?

Hello, I'm new in BabylonJs and I try to modelize an house with an hole as door. I create my house Mesh with the ExtrudeShape shape function and now my problem is to create the door. I substract a box with the CSG function but it does not do a complete hole, only the shape of the box. I did a playground with my current progression. http://www.babylonjs-playground.com/#1MR5CY Is my project is possible ?

Hi! I've been using Babylon for a week or so now and really like how easy it is to use and how well the tutorials are written (I'm using it for a robotics simulation project I'm currently working on). Anyways, I have a question about how textures (and other AssetTasks as well: https://github.com/BabylonJS/Babylon.js/blob/master/src/Tools/babylon.assetsManager.ts) are loaded using the AssetManager. I have a texture image that's being served at /app/assets/sceneassets/mytextureimg.jpg. My Babylon scene is loaded at the url /app/testbabylon. When I try to load a texture using the addTextureTask method of the AssetManager, I specify that the asset is located at "/app/assets/sceneassets/mytextureimg.jpg", however, the network request that the AssetManager makes is to "/app/testbabylon/app/assets/sceneassets/mytextureimg.jpg". This is clearly relative to my current path, I can use an absolute path (in dev: "http://localhost:4000/app/assets/sceneassets/mytextureimg.jpg") and it works correctly, however this seems messy (especially if switching domains). If I end up using "//app/assets/sceneassets/mytextureimg.jpg" the network request is "http://app/assets/sceneassets/mytextureimg.jpg" - which doesn't point to anything. My main question is whether its possible to specify the AssetManager to use the root url of my domain for texture (and/or image, cubetexture, etc.) loading (or have something like a "rootUrl" parameter like AddMeshTask seems to have). Just for reference, here's a snippet of the code I'm using (material is an object that has a name and diffuseTexture property; where diffuseTexture is the url string, scene is a Babylon Scene object). setupMaterial(material, scene) { const babylonMaterial = new Babylon.StandardMaterial(material.name, scene); if (material.diffuseTexture) { const diffuseTask = scene.loader.addTextureTask( `diffuseTextureTask${material.name}`, material.diffuseTexture); diffuseTask.onSuccess = (task) => { babylonMaterial.diffuseTexture = task.texture; }; } return babylonMaterial; } Thanks for any help, Flux159

Is this supposed to happen? http://www.babylonjs-playground.com/#1VL9HD#1 It seems to be a breaking change in 2.3.

Anyone else seeing a spinning camera the first time a PG loads (Chrome)? This started happening for me a few days ago. It's even worse in Firefox. On first load the mouse doesn't work at all. The camera spins after every reload.