I was clicking around http://www.babylonjs.com/  looking for inspiration, and noticed the Ribbons demo is broken (it just comes up as a white screen).

I tried in both Firefox and Chrome (on Linux). All other demos appear to be working, so I imagine it a version upgrade broken something in just this demo?

Hi folks, 

My first post on the forum, so hello all! 

I'm been playing around with babylonjs. My intention is to make a Red Alert style game, mostly just to improve my JS skills, and learn the basic concepts of game development etc. 

However I've struggled to find a best approach for moving meshes around a ground plane. I'm essentially trying to animate a block to move from a selected mesh's initial point, to a selected point. But the movements happen immediately, and feel 'buggy' in my example: http://www.babylonjs-playground.com/#OYE6Q 

Any help much appreciated! 

Cheers,

Ewan

I have encountered a very strange bug.

After leaving a Babylon scene open overnight, it had frozen, with the following error messages in the terminal:

Error: WebGL: vertexAttribDivisorANGLE: Extension is lost.libs.pkgd.js:9:14884
Error: WebGL: drawElementsInstancedANGLE: Extension is lost.libs.pkgd.js:9:17107
Error: WebGL: vertexAttribDivisorANGLE: Extension is lost.libs.pkgd.js:9:15419
Error: WebGL: vertexAttribDivisorANGLE: Extension is lost.libs.pkgd.js:9:14884
Error: WebGL: drawElementsInstancedANGLE: Extension is lost.libs.pkgd.js:9:17107
Error: WebGL: vertexAttribDivisorANGLE: Extension is lost.libs.pkgd.js:9:15419
Error: WebGL: vertexAttribDivisorANGLE: Extension is lost.libs.pkgd.js:9:14884
Error: WebGL: drawElementsInstancedANGLE: Extension is lost.libs.pkgd.js:9:17107
Error: WebGL: vertexAttribDivisorANGLE: Extension is lost.libs.pkgd.js:9:15419
Error: WebGL: No further warnings will be reported for this WebGL context. (already reported 32 warnings

When I refreshed the page, the same errors kept appearing, until I restarted my browser. Has anyone seen anything like this before?

Note: The scene is periodically creating and destroying instances. When the instances are destroyed, .dispose() is called on them, which I assume is the proper way to destroy an instance.

Link on ArcRotateCamera tutorial is missed: https://doc.babylonjs.com/classes/2.3/ArcRotateCamera

 

Quote

A tutorial about ArcRotateCamera can be found here

Hi it's me again hope you guys don't mind me asking all these questions but i have a small problem.

So i have a custom mesh and the mesh is dynamic and needs to get updated so this is how i do it:

var positions = mesh.getVerticesData(BABYLON.VertexBuffer.PositionKind);
// edit positions
mesh.updateVerticesData(BABYLON.VertexBuffer.PositionKind, positions);

Then when i moveWithCollisions the collisions are not updated.

I have worked out a few ways to update the collisions but i'm not sure what is the correct/fastest method

1) mesh.updateVerticesData(BABYLON.VertexBuffer.PositionKind, positions, false, true);
2) mesh.setIndices(mesh.getIndices());
3) mesh.setVerticesData(BABYLON.VertexBuffer.PositionKind, positions);

Whats the correct/fastest method?

Hey everyone !

The brand new iOS 10 update fracking sucks to load BJS cube textures.

I've already had noticed this problem several month ago (on iOS 9) but it happened only very occasionnaly (and pretty randomly). But now, since iOS 10, I don't know what Apple has changed but the bug is happening at least 9 times out of 10, in every mobile browser on iOS.

What the bug is exactly ? When a cube texture is loaded, the cascadeLoad call in Engine.createCubeTexture bugs in the callback for-loop :

for (var index = 0; index < faces.length; index++) {
   _this._workingContext.drawImage(imgs[index], 0, 0, imgs[index].width, imgs[index].height, 0, 0, width, height);
   gl.texImage2D(faces[index], 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, _this._workingCanvas);
}

The code stops in one of the loops claiming that imgs[index] is undefined. The faulty loop iteration number is randomly changing, sometimes the third, sometimes the fourth, sometimes another one... it probably depends how quick the cube images files are loaded.

The bug happens retroactively from BJS 2.5 to (at least) BJS 2.1.

And now, the cherry on the cake: the bug never occur if the browser is in private browsing mode. As if the caching process of the images is responsible of a kind of loading delay or something like that...

Hey everyone Image may be NSFW.
Clik here to view.

I am not sure why but if I create two ScreenSpaceCanvas2D in two different scenes, one of the scenes being shown and not the other (stored in a parent object). The function Canvas2D.prototype._updatePointerInfo is called twice each time I move the mouse, once for the shown Canvas, and once for the canvas that is in the stored scene. 

Since I did not declare a camera in that stored scene the bit of code in babylon.max.js 44657 :

Canvas2D.prototype._updatePointerInfo = function (eventData, localPosition) { 
  ...
  var camera = this._scene.cameraToUseForPointers || this._scene.activeCamera;

  ...
}

return camera as undefined. 

And later on while the function tries to access camera.viewport it returns an error.

This report is not really about solving the bug because if I declare a random camera for the stored scene (like a normal human being not trying to find bugs everywhere) i do not get the error. But I think it was not on purpose that events are captured on a canvas in a scene that is not currently rendered. All in all it is not a real problem for me but it might cause trouble for other people.

To change between scenes I use this bit of code 

/* --- Start the render loop --- */
taskObject.engine.runRenderLoop(function () {
  taskObject.scenes[taskObject.currentScene].render();
});

This is the call stack for the error:

It seems the observables are set up at scene creation and down the callback chain there is no test to check wether the scene is currently being rendered (is that even possible?).

Official sample Samples/Demos/Boom/ doesn't work: 

Quote

Uncaught TypeError: mat.freeze is not a function (boom.js:55)

Hey everyone,

So I have been fighting Sprite2D for hours. I am developping a 2D version of my project and I simply wanted to draw a single sprite2D on my canvas but couldn't, the sprite was not showing. The texture was loading for sure because I could use it on 3D meshes. Another post talked about a similar issue and although the post says the problem was solved, it does not say how or what was really causing it : 

 I am not showing all my experimenting because it would be meaningless, but I kept getting this warning:

(index):1 [.Offscreen-For-WebGL-0x7f84b30bdc00]RENDER WARNING: there is no texture bound to the unit 0

and all the posts on the web about those kind of errors were very foggy... hours passed, thought it was the server, the loading, the transparency... without having any kind of improvement, so I started to cut everything from my code util I was only creating an engine and basically copied paste the babylon example http://babylonjs-playground.com/#20MSFF#16. 

By th way I got also this very benign warning caused by the BABYLON.Texture.NEAREST_SAMPLINGMODE :

[.Offscreen-For-WebGL-0x7f84b30bdc00]RENDER WARNING: there is no texture bound to the unit 0
babylon.max.js:7027 'CanvasRenderingContext2D.webkitImageSmoothingEnabled' is deprecated. Please use 'CanvasRenderingContext2D.imageSmoothingEnabled' instead.

this warning comes from this line _this._workingContext.webkitImageSmoothingEnabled = false; on 7027 babylon.max.js. But this warning has nothing to do with the sprite2D not showing.

To cut a very long story short :

When settings = {} passed to new BABYLON.Sprite2D do not contain a spriteSize property, the sprite.size SHOULD be set to the actual texture size, but it is in fact set to size(0,0) and hence the sprite is not displayed.

This behavior does not seem to be on purpose because the docs clearly state the sprite would take the size of the texture. The code also point in that direction (42630 babylon.max.js):

function Sprite2D(texture, settings) {
            if (!settings) {
                settings = {};
            }
            _super.call(this, settings);
            this.texture = texture;
            this.texture.wrapU = BABYLON.Texture.CLAMP_ADDRESSMODE;
            this.texture.wrapV = BABYLON.Texture.CLAMP_ADDRESSMODE;
            this.size = settings.spriteSize || null; // LOOK HERE !
            this.spriteLocation = settings.spriteLocation || new BABYLON.Vector2(0, 0);
            this.spriteFrame = 0;
            this.invertY = (settings.invertY == null) ? false : settings.invertY;
            this.alignToPixel = (settings.alignToPixel == null) ? true : settings.alignToPixel;
            this._isTransparent = true;
            if (!this.size) { /// AND HERE !!
                var s = texture.getSize();
                this.size = new BABYLON.Size(s.width, s.height);
            }
        }

So I tried to understand why this.size was not set to the texture size...

So first of all, when the super is called the size is set to (0,0).

Then it SHOULD be set to null if spriteSize is not set. But there is an interaction between getters and setters.

Since size is a SmartPropertyPrim... the GETTER is called everytime you call the setter on 36968:

SmartPropertyPrim._hookProperty = function (propId, piStore, typeLevelCompare, dirtyBoundingInfo, kind) {
            return function (target, propName, descriptor) {
                var propInfo = SmartPropertyPrim._createPropInfo(target, propName, propId, dirtyBoundingInfo, typeLevelCompare, kind);
                if (piStore) {
                    piStore(propInfo);
                }
                var getter = descriptor.get, setter = descriptor.set;
                // Overload the property setter implementation to add our own logic
                descriptor.set = function (val) {
                    // check for disposed first, do nothing
                    if (this.isDisposed) {
                        return;
                    }
                    var curVal = getter.call(this);
                    if (SmartPropertyPrim._checkUnchanged(curVal, val)) {
                        return;
                    }
                    // Cast the object we're working one
                    var prim = this;
                    // Change the value
                    setter.call(this, val);
                    // Notify change, dirty flags update
                    prim._handlePropChanged(curVal, val, propName, propInfo, typeLevelCompare);
                };
            };
        };

The getter is :

Object.defineProperty(Prim2DBase.prototype, "size", {
            /**
             * Size of the primitive or its bounding area
             * BEWARE: if you change only size.width or height it won't trigger a property change and you won't have the expected behavior.
             * Use this property to set a new Size object, otherwise to change only the width/height use Prim2DBase.width or height properties.
             */
            get: function () {
                if (!this._size || this._size.width == null || this._size.height == null) {
                    if (Prim2DBase.boundinbBoxReentrency) {
                        return Prim2DBase.nullSize;
                    }
                    if (this._boundingSize) {
                        return this._boundingSize;
                    }
                    Prim2DBase.boundinbBoxReentrency = true;
                    var b = this.boundingInfo;
                    Prim2DBase.boundinbBoxReentrency = false;
                    return this._boundingSize;
                }
                return this._size;
            },
...

So basically a size (0,0) is returned if size is null sooo this:

if (!this.size) { /// AND HERE !!

Will never be true.

I think.

Hope it helps - time to sleep ! Image may be NSFW.
Clik here to view.

Hello !

First, for my first message, i want to thanks all the babylonJS developer for their awesome work !

I recently tried the Terrain Meterial for generating a custom terrain with a mixmap...

All is good so far, i even found a process to generate a mixmap with Blender and Cycles from a heightmap (I attached an image to the post for people who want this).

I still have an issue with the shadows or the TerrainMaterial, started though i was making a mistake, because my scene is more and more complicated,

but i reproduce the bug on the playground, and i got the same error :

http://www.babylonjs-playground.com/#E6OZX#61

Unfortunatelly i'm new with WebGL, BabylonJs and all this stuff, and i can't understand nothing nothing about this material, it's way too more complicated for me...

Can someone tell me if it's a bug, or if the Terrain Material maybe cannot support shadows yet, or perhard i just made an horrible mistake XD

Thanks

Image may be NSFW.
Clik here to view.

When using chains of parent objects, especially with large distances, the camera jumps all over the place:

http://www.babylonjs-playground.com/#NJMSC#4

Problem kicks in just after a distance of 10,000,000.

This could perhaps be solved by utilising https://github.com/MikeMcl/bignumber.js/

Hey,

It seems using CACHESTRATEGY_CANVAS changes the background color of the canvas:

http://babylonjs-playground.com/#1GWM8Z#0

http://babylonjs-playground.com/#1GWM8Z#1

without caching on the left:

Image may be NSFW.
Clik here to view.

hi everyone.

i'm not sure if it is a bug, but i can't change camera's fovMode without changing fov parameter also.

i have a radiobutton that toggle fovMode between VERTICAL_FIXED and HORIZONTAL_FIXED and a slider that modulate the fov parameter.

if i select a fovMode, i have to manually slightly change the fov parameter to see the effect on screen.

why?

thanks everyone!

Hi the following code gives a webGL error: INVALID_OPERATION: drawElement: no buffer is bound to enabled attribute

If you remove the diffuseTexture it works, and I tried calling material.dispose and diffuseTexture.dispose to no avail, I've reverted to 2.4 and this does not occur.

Thank you for the amazing work!

var material = new BABYLON.StandardMaterial('texture', scene);
        material.diffuseTexture = Util.texture('assets/height.jpg', scene);
        material.emissiveColor = new BABYLON.Color3(0.5, 0.5, 0.5);
        
        var mesh = BABYLON.MeshBuilder.CreateIcoSphere('Ball', {
            radius:64, subdivisions:4
        }, scene);
        mesh.position.x = 64;
        mesh.position.z = 256;
        mesh.position.y = 32;
        mesh.material = material;
        
        setTimeout(() => {
            console.log(mesh);
            console.log(scene.meshes.length);
            setTimeout(() => {
                mesh.visibility = false;
                mesh.dispose();
                console.log(scene.meshes.length);
            }, 1000);
        }, 2000);

Just working through some tutorials and came across a little problem.

The playground demo http://www.babylonjs-playground.com/#DZTQH#2 has an error on load

Compilation error

Line 10:44 - Cannot read property 'detachControl' of undefined

Thanks for the amazing tool

hi,

i'm working with FreeCamera, which is a TargetCamera.

if you move the mouse left or right, the camera rotates according to your movement, around y axis by default; but if you change the upVector, it rotates according the old configuration!

in my opinion, cameraRotation should be applied depending to the actual upVector, not the defaultUpVector, isn't right?

looking for usages of member upVector in TargetCamera, i see that it's updated only in _updateCameraRotationMatrix function and used only in _getViewMatrix.

furthermore, it's normalized in setTarget function, but it isn't used there (defaultUpVector is used in its place).

thanks

Hey,

I just upgraded to OSX Sierra and this bit of code does not work anymore on chrome :

/* --- Skybox --- */
  var skyboxObject = BABYLON.Mesh.CreateBox("skyBox", 10000.0, scene);
  var skyboxMaterial = new BABYLON.StandardMaterial("skyBox" + sceneKey, scene);
  skyboxMaterial.backFaceCulling = false;
  skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture(taskObject.ASSETS_FOLDER + "/textures/fantasy/Sky",
    scene, ["_px.png", "_py.png", "_pz.png", "_nx.png", "_ny.png", "_nz.png"]);
  skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE;
  skyboxMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
  skyboxMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
  skyboxObject.material = skyboxMaterial;
  skyboxObject.rotation.x = Math.PI;

I get this :

Image may be NSFW.
Clik here to view.

Only one side of the cube. No error in the console.

I will try to get more information on this, I have been swamped these past few days... sorry.

This bug is not present in safari.

Hello,

From this website :

http://www.babylonjs-playground.com/

I can't download the zip from :

- 13 : Environment

- 14 : Heightamp

It writes "Creating archive... please wait"

and when i change the scene : "compilation error  this.textures[0].dispose is not a function".

Thanks

I have a recursive loop loading assets and presenting them in a preloader fashion in a scene that I am deploying.  Initially when I was only loading one element of my array at a time to troubleshoot I did not notice, but once I started doing more then one item in my array, It redid all the requests prior to it, so after 48 objects my item count was like 9k, not like 116 which was anticipated.

I noticed that the callback to the onSuccess redid all the other tasks prior to it in addition to the one that finished.  My variable hierarchy was correct and so was the rest of the script, I would post the script to show and demonstrate but as this is a paid project I am unable to share proprietary information. 

Alas I found a workaround and fixed it but I feel like this is should be unnecessary.

 

...
setTimeout(function(){self._buildPresets(list,c);},200);
			
		};
		
		
		this.loader.load();
		this.loader.reset();
...

Resetting the loader tasks after each load seemed to do the trick, but in my mind the order of operations and execution stack this working does not make any since to me... but it works so I'm not complaining.

Why do I need to reset the task list? shouldn't after completion and no Errors the task drop automatically from the stack?

Alerting @Deltakosh

There appears to be a race condition in 2.5 when working with multiple engines and scenes. Previously my code worked fine on 2.4, but when experimenting with 2.5 I see the attached errors.

I'm fairly certain that this happens when calling new Babylon.Engine(canvas); more than once when my app starts up. (Note I'm working with multiple canvases)

Image may be NSFW.
Clik here to view.