Jump to content

r is undifined


Recommended Posts


I'm trying to create a new material to be applied on a hightmap. But I get this error:


TypeError: r is undefined[Meer info]  babylon.js:16:7807

    t http://localhost:5381/babylonjs/babylon.js:16:7807
    r http://localhost:5381/babylonjs/babylon.js:16:14755
    LoadZone http://localhost:5381/editorfunctions.js:2:26
    Editor.prototype._ProcessXojoMessages http://localhost:5381/editor.js:49:17

The code of loadzone is:

function LoadZone(scene: BABYLON.Scene, hmURL: string, texURL: string, Width: number, MaxHeight: number, Length: number)
    let groundMaterial = new BABYLON.StandardMaterial("groundMaterial", scene);
    groundMaterial.diffuseTexture = new BABYLON.Texture(texURL, scene);

    let ground = BABYLON.MeshBuilder.CreateGroundFromHeightMap("ground", hmURL, {width:Width, height:Length, subdivisions:4, minHeight:0, maxHeight:MaxHeight, updatable:false}, scene);
    ground.material = groundMaterial;


I wanted to get my code in a playground, but my usecase is too specific: I have a websocket connecting to a server, and once a certain message is received, this function is called.

Link to comment
Share on other sites

usual error

You have to wait that your GroundMesh is created (the heightmap file dowload can last a little) before assigning it a material. For this, just use the callback parameter onReady in the parameter list : http://doc.babylonjs.com/classes/2.5/meshbuilder#static-creategroundfromheightmap-name-url-options-scene-rarr-groundmesh-classes-2-5-groundmesh-

Link to comment
Share on other sites

Thanks Jerome for your superfast answer.

But now the error changed:


TypeError: n is undefined[Meer info]  babylon.js:6:28905

EDIT: Chrome gave me a slightly better error:



babylon.js:6 Uncaught TypeError: Cannot read property 'addMesh' of undefined at i [as constructor] (babylon.js:6)
at i.r [as constructor] (babylon.js:13)
at new i (babylon.js:23) at Function.t.CreateGroundFromHeightMap (babylon.js:14)
at LoadZone (editorfunctions.ts:10)
at WebSocket.Editor._ProcessXojoMessages (editor.ts:71)

My code is now changed too:


/// <reference path="babylonjs/babylon.d.ts"/>
import GroundMesh = BABYLON.GroundMesh;
let currentScene: BABYLON.Scene
let textureURL: string;
function LoadZone(scene: BABYLON.Scene, hmURL: string, texURL: string, Width: number, MaxHeight: number, Length: number)
    currentScene = scene;
    textureURL = texURL;

    let ground = BABYLON.MeshBuilder.CreateGroundFromHeightMap("ground", hmURL, {width:Width, height:Length, subdivisions:4, minHeight:0, maxHeight:MaxHeight, updatable:false, onReady:HeightMapLoaded}, scene);


function HeightMapLoaded(mesh: GroundMesh)
    let groundMaterial = new BABYLON.StandardMaterial("groundMaterial", currentScene);
    groundMaterial.diffuseTexture = new BABYLON.Texture(textureURL, currentScene);
    mesh.material = groundMaterial;

The error is now on the BABYLON.MeshBuilder.CreateGroundFromHeightMap


Is there a debugbuild of babylonjs? I must be overlooking it.

Link to comment
Share on other sites

Hi Jerome


That wasn't the problem. When I just put one line in LoadZone, straight from the docs, I also get the same error:


var ground = BABYLON.MeshBuilder.CreateGroundFromHeightMap("gdhm", "assets/heightmaps/default.png", { width: 6, subdivisions: 4 }, scene);

So there must be something wrong with my setup, however, the createscene works as expected.

Anybody can view the source here: http://conservatorium-brugge.be/babylon/

But you won't see the error because there probably won't be a websocket server running on your localhost which sends the right commands.

Is it maybe impossible to load a heightmap after the createScene function?

Link to comment
Share on other sites

Hmh, I tried about everything I possibly can, the error only shows up after I call it from an incoming websocketmessage.

@Deltakosh, could it be possible that the websocketevents break babylonjs in any way?

I created the simplest possible script I could to show of the 'bug'. There is nothing wrong with the websocketcode, it is called an the alert("groundcreation") is called.


/// <reference path="babylonjs/babylon.d.ts"/>
var Editor = (function () {
    function Editor(canvasElement) {
        // Create canvas and engine
        this._canvas = document.getElementById(canvasElement);
        this._engine = new BABYLON.Engine(this._canvas, true);
        this._socketConnection = new WebSocket("ws://");
    Editor.prototype.createScene = function () {
        // create a basic BJS Scene object
        this._scene = new BABYLON.Scene(this._engine);
        // create a FreeCamera, and set its position to (x:0, y:5, z:-10)
        this._camera = new BABYLON.FreeCamera('camera1', new BABYLON.Vector3(0, 5, -10), this._scene);
        // target the camera to scene origin
        // attach the camera to the canvas
        this._camera.attachControl(this._canvas, false);
        // create a basic light, aiming 0,1,0 - meaning, to the sky
        this._light = new BABYLON.HemisphericLight('light1', new BABYLON.Vector3(0, 1, 0), this._scene);
        // create a built-in "sphere" shape; with 16 segments and diameter of 2
        var sphere = BABYLON.MeshBuilder.CreateSphere('sphere1', { segments: 16, diameter: 2 }, this._scene);
        // move the sphere upward 1/2 of its height
        sphere.position.y = 1;
    Editor.prototype.animate = function () {
        var _this = this;
        // run the render loop
        this._engine.runRenderLoop(function () {
            var fpsLabel = document.getElementById("fpslabel");
            fpsLabel.innerHTML = _this._engine.getFps().toFixed() + " fps";
        // the canvas/window resize event handler
        window.addEventListener('resize', function () {
        this._socketConnection.addEventListener('open', function () {
        this._socketConnection.addEventListener('message', this._ProcessXojoMessages);
    Editor.prototype._ProcessXojoMessages = function (me) {
        var params = me.data.split("|");
        switch (params[0]) {
            case "LoadZone":
                var ground = BABYLON.Mesh.CreateGroundFromHeightMap("ground", "assets/heightmaps/default.png", 256, 256, 245 * 256, 0, 30, this._scene);
    return Editor;
window.addEventListener('DOMContentLoaded', function () {
    // Create the game using the 'renderCanvas'
    var game = new Editor('renderCanvas');
    // Create the scene
    // start animation


Link to comment
Share on other sites

No it would not, sounds like a scope issue.  I am at a wedding getting drunk right now so yeah... sorry I can't be more help at this moment but if no one else jumps on this I'll help by tommrow.  


But r undefined I can guarantee is a variable in the constructor is not being referenced correctly. Most likely the scene.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...