Error in onSuccess callback!

In this example https://playground.babylonjs.com/#1I3CTP am trying to get the value of layerMultiplier (line114 - layerMultiplier is a multiplier per layer of spheres) dynamic way (line 115) I added a input number and tried to get that value, then I have this error "Unable to import meshes: Error in onSuccess callback "! but when I let the variable static like in the example it’s working.

How about
var layerMultiplier = parseInt(_this.numberEntered);
?

2 Likes

yeees! but it’s working only outside of the “ImportMesh” function, when I declare var layerMultiplier = parseInt(_this.numberEntered) instead of line 114 and 115, still the same problem “unable to import meshes” … I am wondering how does the relation between a declaration of that variable and importing the mesh! So when I am declaring anything using a data binding, then its not working.

_this.numberEntered is never defined anywhere, so I’m not sure how you would reference it

var layerMultiplier = _this.numberEntered || 5;
till you have a section that declares the numberEntered

var layerMultiplier = _this.numberEntered || 5 the same, impossible to import the mesh!
When I define var layerMultiplier = parseInt(_this.numberEntered) in onValueChangedObservable (between line 146 and 147 )the mesh is imported but the value of layerMultiplier is NaN ! And I tried the same for var layerMultiplier = _this.numberEntered || 5; inside onValueChangedObservable is considered as “5” so still _this.numberEntered is not called!

you never define it, _this.numberEntered appears nowhere else. :slight_smile:

What are you trying to do?

I would like to call the number entered in the input field and use as layerMultiplier, instead of using the static way.

3

you need to set it when the object is initialized, or have the fallback like I had with the || and a default number.

Then have an event callback for when you change the input to update the number.

The way you have it is layermultiplayer always comes up as undefined. So you can not do any math with it and it’s causing the load callback to fail.

ok I did like that:

1

I get each value by each input and so far I can not set it to layerMultiplier, still the same problem with importing the mesh during the setting of any value to layerMultiplier!

I tried even to call a value without input by defining:
2
and inside the ImportMesh function:
3
still doesn’t work, but if I define var layerMultiplier = 2; or what ever which value (static way) then is working…

Can you share an updated pg?

it something to do with how you are setting the variables, they are not getting set. I guess I don’t know enough about Vue to help you with the whole default data thing.

but in your playground you never set it anywhere, where do you actually set the value for the numberOfTransport in the PG.

Yes in the PG there is not, it was just a example that I am working on it to have an idea.

This what I am doing now

<input type = "number" v-model="NumberEntered">

And define the data

data: function () {
  return {
          NumberEntered: 2,
          layerMultiplier:0
     }
},

And here getting each value by every input:

    watch : {
      numberEntered(value){
       this.$emit('numberOfTransport', value);
       this.layerMultiplier = value;
       console.log(this.layerMultiplier);
      }
    },

So I’m getting each value of input and trying to set it to the variable layerMultiplier.

Now I define the variable

let layerMultiplier = this.layerMultiplier

The mesh is imported but the layerMultiplier not getting set, is getting the value as is defined “0” How you think to do the callback function to set layerMultiplier by each update of numberEntered?

well I have no idea how your system is working so it is tough to help :slight_smile:
This seems more a VUE question to be honest

Perhaps you can share the code on some github page?

Hi. An easy way can be to store your NumberEntered variable, and inside babylonjs take it from there.
Btw, I think you are using 2 different ‘this’ for get and set the variable. But maybe i didn;t understand well from your code snippet.

here is the code https://codesandbox.io/s/24w7922m70

the “layerMultiplier” is getting the value “3” as is defined by default it in data, so while changing the number of input nothing ill change. The problem is how to set that variable? I guess it’s missing somehow to set “layerMultiplier” by using callback function!

PS: the component is called Tower.vue and in case of any kind of this problem Error in nextTick: “TypeError: Cannot read property ‘AdvancedDynamicTexture’ of undefined” just do any changment in the code even space, then will work! :slight_smile:

I asked Brian who is the author of Babylon.js Vue to see if he can help :slight_smile:

Alright @Lokamidou I got a working setup for you. When you change the layerMultiplier in the input element it will trigger a changed layer height in the scene. I think this was just a problem of knowing how to better organize the data and events.

See it here: Vue Template - CodeSandbox

Take a look through the minimal refactor I did and I’ll happily answer any questions you have.

My advice would be to try and leverage the vue component a bit more, i.e. breaking up your functions into vue methods, storing state on the data object, etc… Also, I wouldn’t recommend assigning a variable to this, you should leverage ES6 lambdas (() => {}) to stay in the outer function’s this scope.

Also shameless plug for Vue-Babylonjs which will initialize your scene and has a component structure for creating elements within the scene.

4 Likes

Thanks a LOT @BrainBacon

1 Like

@BrainBacon Thank you for everything! I admit it was a bit mess and regarding Vue-Babylonjs I tried in the begining to work with it, unfortunately did not work for me but I am planing anyway to try again! would be so much better :wink:

1 Like