Englund Englund - 2 months ago 16
Dart Question

Loading an object in Three.Dart

I'm trying to use the ported Three.JS for DART (Three.dart) and load an object file that is lying in my project root, in the root i also have the index.html and main.dart files.

Basically i have been following a demo found at https://github.com/threeDart/three.dart/tree/master/example/web_gl_loader_stl , there isn't one for the OBJLoader class there, but since those examples were written it has been implemented.

The code i'm using to try and load the object is the following:



loader = new OBJLoader();

loader.load('zergling.obj').then((object) {

var geometry = object.geometry;
var mesh = new Mesh(geometry, material);
mesh.position.setValues(0.0, -0.37, -0.6);
mesh.rotation.setValues(-Math.PI / 2, 0.0, 0.0);
mesh.scale.setValues(2.0, 2.0, 2.0);

mesh.castShadow = true;
mesh.receiveShadow = true;
scene.add(mesh);
});


The object is a simple zergling. I render the scene later on in the code but it doesn't seem to work.

I have looked at this thread How to load obj model via three.dart? aswell. But no luck after that.

Any comments of how i could proceed? Do you see any problems in the loading code? If not i could provide a gist with the entire codebase.

Answer Source

I don't use Three.dart and I had just a brief look at your code but I assume your code misses to chain subsequent code with .then((..) ...) you need when you call async code

loader.load('zergling.obj').then((object) {
  ...
}).then((x) {
  // here the result is available
  renderer = new WebGLRenderer(antialias: true, alpha: false);
  renderer.setSize(window.innerWidth, window.innerHeight);
  ...
});
// here no result has yet been loaded

When you all an async method like load (which returns a future) then only a callback is registered and the following code is executed (after }); in your case. When this synchronous thread has ended the queue of registered callbacks is registered one after another.

The new async/await feature makes it easier to work with such code

Future someFunc() async {
  // here the result is available
  var object = await loader.load('zergling.obj');
  var geometry = object.geometry;
  var mesh = new Mesh(geometry, material);
  mesh.position.setValues(0.0, -0.37, -0.6);
  mesh.rotation.setValues(-Math.PI / 2, 0.0, 0.0);
  mesh.scale.setValues(2.0, 2.0, 2.0);

  mesh.castShadow = true;
  mesh.receiveShadow = true;
  scene.add(mesh);
}

You need a dev channel Dart version (1.9.0-dev...) in order to be able to use this new feature. Using async/await doesn't change the execution, it only changes the way the code looks like.

See