Search the Community

I'm having trouble using `createInstance` when importing BabylonJS as an ES6 module. // <script src='main.js' type='module'></script> import {Engine, Scene, ArcRotateCamera, Vector3, MeshBuilder, Color3, HemisphericLight} from './node_modules/babylonjs/es6.js' document.addEventListener('DOMContentLoaded', () => { const canvas = document.getElementById('renderCanvas') const engine = new Engine(canvas, true) const scene = new Scene(engine) const camera = new ArcRotateCamera('camera', 1, 0.8, 10, new Vector3(0, 0, 0)) camera.setPosition(new Vector3(0, 0, -100)) scene.activeCamera.attachControl(canvas) const light = new HemisphericLight('', new Vector3(0, 1, 0)) light.diffuse = new Color3(1, 1, 1) light.groundColor = new Color3(0.2, 0.2, 0.2) let mesh = MeshBuilder.CreateSphere('', {}) mesh.createInstance('') }) If I run the previous code I get the following error: TypeError: Cannot set property renderingGroupId of [object Object] which has only a getter es6.js:17243 at InstancedMesh.AbstractMesh [as constructor] (c:\Users\phil\code\sandbox\babylonjs-test\node_modules\babylonjs\es6.js:17243:37) at new InstancedMesh (c:\Users\phil\code\sandbox\babylonjs-test\node_modules\babylonjs\es6.js:55221:33) at Mesh.createInstance (c:\Users\phil\code\sandbox\babylonjs-test\node_modules\babylonjs\es6.js:29095:21) at HTMLDocument.document.addEventListener (c:\Users\phil\code\sandbox\babylonjs-test\main.js:19:9) Importing the library in a script tag works fine: // <script src="https://cdn.babylonjs.com/babylon.js"></script> // <script src='main.js'></script> document.addEventListener('DOMContentLoaded', () => { const canvas = document.getElementById('renderCanvas') const engine = new BABYLON.Engine(canvas, true) const scene = new BABYLON.Scene(engine) const camera = new BABYLON.ArcRotateCamera('camera', 1, 0.8, 10, new BABYLON.Vector3(0, 0, 0)) camera.setPosition(new BABYLON.Vector3(0, 0, -100)) scene.activeCamera.attachControl(canvas) const light = new BABYLON.HemisphericLight('', new BABYLON.Vector3(0, 1, 0)) light.diffuse = new BABYLON.Color3(1, 1, 1) light.groundColor = new BABYLON.Color3(0.2, 0.2, 0.2) let mesh = BABYLON.MeshBuilder.CreateSphere('', {}) mesh.createInstance('') }) I'd like to avoid bundlers and transpilers while developing the code and just package it up later on.

Hi All, I have issue with clone mesh and cloned mesh attach to parent. After attached to parent cloned mesh position behaving strangely. http://www.babylonjs-playground.com/#HWQ2QH Line 22-23-24 //behaving strangely I've been scratching my head for a while, any suggestion?

I try to optimize one of my scene and to do so I adapt my code to use createInstance instead of clone. But as a result my scene (fps) is slower with createInstance than with clone when it should be the opposite right? To sum up my code, here is the steps I follow : - import mesh - clone mesh and add material (because one mesh can have 2 different materials) - create instance mesh - add in the scene At the third step, I get a better fps when I use clone instead of createinstance. Do you have an idea? Thanks!

Hi, I have question about creating meshes based on one prototype. I have multiple meshes, that have same geometry but should have different material (color), idea was to create prototype mesh in 3d max, add bump map and export it. Than I found that Mesh class have source mesh, so I passed my prototype mesh into mesh constructor: PG So far everything was working I could create new meshes and change material for them. But problems started when I tried to create instances from new meshes as all instances where moved to same position: PG But if I make clones from meshes they work: PG Was it designed to be used like that, or I am overusing system Maybe there is better way to achieve same result? prototype -> different meshes -> instances. @Deltakosh some ideas there?

Hi, I have issue that elements created with createInstance sometimes don't show up on screen but exist in memory. I managed to make small PG to show issue. There 2 objects are initialised on click. On first click both instances appear but on next one only second instance appear, after many clicks all instances appear. Sometimes helps to change camera angle to see all meshes. Device: Galaxy S4 OS: Android 4.4.2 Browser: Chrome 59.0.3071.125 I have seen similar issue also on desktop devices, that instanced meshes disappear and appear back on camera rotation, but that I couldn't reproduce in PG yet.

Hi, Got error on android device when createInstance is used ,PG. Device: Galaxy Tab 3 WebGl: renderer:"PowerVR SGX 544MP2", vendor:"Imagination Technologies", version:"WebGL 1.0 (OpenGL ES 2.0 Chromium)" Android: 4.4.2 Error: Uncaught TypeError: this._gl.vertexAttribDivisor is not a function at n._bindVertexBuffersAttributes (babylon.js:5) at n.recordVertexArrayObject (babylon.js:5) at t._bind (babylon.js:15) at r._renderWithInstances (babylon.js:12) at r._processRendering (babylon.js:12) at r.render (babylon.js:12) at t.render (babylon.js:13) at t.renderUnsorted (babylon.js:9) at t.render (babylon.js:9) at t.render (babylon.js:8) [.Offscreen-For-WebGL-0x6f7cfc20]GL ERROR :GL_INVALID_ENUM : GetIntegerv: <- error from previous GL command [.Offscreen-For-WebGL-0x6c2ab010]GL ERROR :GL_INVALID_ENUM : GLES2DecoderImpl::ClearWorkaround: <- error from previous GL command

Hello forum! First post here, and I'm starting off with -probably- a newbie question: I'm trying to optimize an experiment that uses a lot of textured planes, cloned with createInstance, but I'm getting weird z-sorting issues - as you can see here: http://rocketclowns.com/canvas/babylon2/ The leaves are created with createInstance, like this: var leavesMaterial = new BABYLON.StandardMaterial("leavesTexture", scene); leavesMaterial.diffuseTexture = new BABYLON.Texture("textures/viny_leaves.png", scene); leavesMaterial.diffuseTexture.hasAlpha = true; leavesMaterial.useAlphaFromDiffuseTexture = true; var leaves = BABYLON.Mesh.CreatePlane("plane", 75.0, scene); leaves.scaling.y = 0.71; leaves.material = leavesMaterial; for (var l = 0; l < 128; l++) { var newLeavesInstance = leaves.createInstance("iLeaves" + l); newLeavesInstance.position.x = 32 + Math.random() * 96; newLeavesInstance.position.z = Math.random() * 256; } Am I overlooking something that causes the weird z-sorting behaviour? Many thanks in advance