croustibat

Hi! I found my problem. This is not a bug obviously. If someone encounter this issue, here was the cause: if you go to -> chrome://flags/, you can activate special chrome features such as GPU rendering etc. The following feature, once activated, broke the event system: chrome://flags/#enable-experimental-web-platform-features Don't!! Maybe this post shouldn't be in Bugs anymore!

Hello! I just need to know if the following behavior is normal: http://www.babylonjs-playground.com/#2BJVDK#0 This playground will log the event mouse button pushed when clicking dragging the mouse on the scene. It logs '-1' is that an expected behavior? I use the scene pointer observable to get the mouse events: scene.onPointerObservable.add(pi=> { pi.type===4 && pi.event.buttons && console.log('dragging event, button:', pi.event.button); }); Edit: I noticed that on release 2.4.1 on the babylon npm package Thanks for your nice work on Babylon js! Bye

Well, that's embarassing, but this doesn't seem to work. Even if I call PolygonMeshBuilder from a scope where poly2tri is defined, inside this constructor, poly2tri is not visible. I probably lack some knowledge here. Looking for a plan B now...

Thanks for the warn Vousk prod I will submit a PR Deltakosh!

Hi, I recently encountered a small problem when I refactored my project relying on polygon mesh builder using ES6 modules and npm. If I include babylon js and poly2tri with npm and import it using import poly2tri from 'poly2tri'; import BABYLON from 'babylonjs'; This way, the poly2tri package is available locally. So, I get an error saying: "PolygonMeshBuilder cannot be used because poly2tri is not referenced" It probably comes from there (babylon.polygonMesh.ts): if (!("poly2tri" in window)) { throw "PolygonMeshBuilder cannot be used because poly2tri is not referenced"; } So, I'm forced to do the following before using PolygonMeshBuilder (which is not a very good way to go IMO): window.poly2tri = poly2tri; Shouldn't it be: if (!("poly2tri" in window || polytri)) { throw "PolygonMeshBuilder cannot be used because poly2tri is not referenced"; } EDIT: Sorry, I put this in the wrong place, and I can't delete it neither move it.

Hi again, I had the time to make some testing around those concerns. Starting form fresh, with a simple (and clean ) project, I could make the dom destruction/reconstruction work fine with Babylon engine. But after a few cycles of creating a canvas DOM node, creating a babylon engine, building up a dummy scene, disposing the engine, destroying the canvas node, I ended up with a strange chrome warning saying there were too many webgl contextes. This seems to be a known issue inherent to js garbage collection. For me that was the final proof saying that this is definitely the wrong pattern here, as Temechon said. And reinitializing the scene is simple by doing so:engine.stopRenderLoop();engine.clear(BABYLON.Color3.Black(),false,false);window.removeEventListener('resize');if (engine.scenes.length!==0) { //if more than 1 scene, while(engine.scenes.length>0) { engine.scenes[0].dispose();}I couldn't observe any memory leak doing this dozens of time, it seems pretty reliable. I will keep developing with that method, which is simple and clean.

Thanks for pointing the right place. From what I see of the source, dispose() already seems to dispose all the scenes, stops the render loop, removes any event listeners, releases the audio engine, does something with webgl (probably reset it). Everything seems to be properly destroyed, so that's strange that I can't dispose an engine object and create a new one, then setting a new render loop with a new scene without my program to fail. My code right now is a bit messy, I will try to reproduce that behaviour in a babylon playground, just for curiosity. And for science.

Temechon, thanks again, this made the trick (hiding the canvas). But still, I feel frustrated about not knowing what's behind engine.dispose()! Anyway, problem solved!

Thanks Temechon, I'll give it a try

Hi Temechon! I'm building my app using the Meteor framework. In usual meteor patterns, dom elements can get created/destroyed quite often. But as you say, I think I'm going to hide/show the canvas, and just flush the meshes, textures, materials and cameras, it should do the trick. I thought there was a quick/efficient way of doing all that stuff by disposing the engine instance. But sadly, disposing and deleting the engine seems to make me unable to create a new one.

Hi! I'm developing a web app with a 3d viewport made with babylon js. It's initialized on a canvas object. In my app, it's possible that the viewport is completely destroyed and I need to flush every BABYLON objects instantiated. It's possible then that the canvas is recreated and I need to build a new scene again (on a new engine). There are two functions, one called when the canvas dom object is created and rendered, the other is called when it's destroyed. After the canvas is created, I do this: function CreateEngine(_canvas) { var engine = new BABYLON.Engine(_canvas, true); window.addEventListener("resize",function() { engine.resize(); }); return engine; }; var engine = CreateEngine(mycanvas); var scene = new BABYLON.Scene(engine); scene.clearColor = new BABYLON.Color3(0.97,0.97,0.97); console.log("Created a scene"); engine.runRenderLoop(function(){ scene.render(); });Then when the canvas is destroyed I do this: if (engine !== null) { console.log("Scrapping engine..."); currentScene.dispose(); delete currentScene; engine.stopRenderLoop(); engine.dispose(); delete engine; engine = null; }First canvas creation works fine No error is raised when I destroy it. But, when I create the canvas again, here is what I get: So, I guess I don't reset the scene properly right?

Thanks deltaKosh, but it's impossible to reproduce my app with the playground Anyway I just managed to do what I wanted, but I'm not sure if the keyCode value is implemented in all browsers, plus, it's very difficult to read scene.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnKeyUpTrigger, function (evt) { if(evt.sourceEvent.keyCode === 27) { console.log("do something!"); }}));Thanks again!

Hi everybody, I need to know what is the parameter for creating a trigger on special key such as Escape: scene.actionManager.registerAction(new BABYLON.ExecuteCodeAction({ trigger: BABYLON.ActionManager.OnKeyUpTrigger, parameter: "Escape" }, function () { console.log("heya");}));And if there is a documentation on that I could not find it, sorry EDIT: of course the code above does not work!

The arcrotate cam now supports panning, yes, but on a plane parallel to the camera's xOy plane, I wanted a panning on the world xOz plane to easily move the cam along a map, which is mainly horizontal, right? You can try the playground I gave, and alternately replace my cam by the arcrotatecam to see the difference Indeed, I just had to tweak the panning direction of the arcrotate cam to get the right effect!

After some work on other parts of my app, I returned to this camera customization work. I just copy/pasted the babylon.arcRotateCamera.js commented the "var BABYLON;" renamed every "ArcRotateCamera" into "ArcRotatePanCamera", included it in my project and began the dirty work. And I ended up with that camera. With almost no modifications. http://www.babylonjs-playground.com/#1OIVT0#2 Left mouse: pan along the xOz plane Right mouse: arcrotate And a new function BABYLON.ArcRotatePanCamera.goToPosition that smoothly translates the target towards a given point until it's close to it (BABYLON.Engine.Epsilon) A pointer down or gesture start event interrupts this behaviour. I think this is an interesting cam behaviour for games such as RTS and similar. A smooth follow can be done with minor modifications of this version. I'm pretty happy with that, unfortunately, there is a lot of duplicated code (99% at least) between this cam and arcRotateCamera, I should have made this new cam inherit from the arcRotateCam in order to make it maintainable, but my js skills kind of suck, and I didn't know how to do that, so feel free to explain me how to proceed!