Blender export to Three.js

Question

I just created a random mesh using Blender and I want to export it to be used in HTML5 via the Three.js. I haven\'t seen any decent tutorials that shows how to do this. Can

Answer 1

The selected answer doesn't return a promise or a callback, so you don't know when you can set things. I've added a small class that will and shown how you can use it. It wraps collada loader.

var ColladaLoaderBubbleWrapper = function() {
    this.file = null;
    this.loader = new THREE.ColladaLoader();
    this.resolve = null;
    this.reject = null;

    this.colladaLoadedNotifier = this.colladaLoadedNotifier.bind(this);
    this.onLoad = this.onLoad.bind(this);
};

ColladaLoaderBubbleWrapper.prototype.loadCollada = function(file) {
    this.loader.load(file, this.onLoad, this.onDownloadProgress);
    return new Promise(this.colladaLoadedNotifier);
};

ColladaLoaderBubbleWrapper.prototype.colladaLoadedNotifier = function(resolve, reject) {
    this.resolve = resolve;
    this.reject = reject;
};

ColladaLoaderBubbleWrapper.prototype.onLoad = function(collada) {
    this.resolve(collada);
};

ColladaLoaderBubbleWrapper.prototype.onDownloadProgress = function(xhr) {
    console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
};

Then to use it include the collada loader:

and in your main js

var colladaLoader = new ColladaLoaderBubbleWrapper();
var colladaLoaded = colladaLoader.loadCollada('colladas/brick/brick.dae');
colladaLoaded.then(function(collada) {
    scene.add( collada.scene );
});