Sign in to follow this  
dbawel

[SOLVED] How to add OBJ files dynamically in scene

Recommended Posts

var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas);
var scene = new BABYLON.Scene(engine);

scene.clearColor = new BABYLON.Color3(1, 1, 1);
var camera = new BABYLON.FreeCamera("camera", new BABYLON.Vector3(-2.15, 0, -3.2), scene);
camera.minZ = 0.01;
var light = new BABYLON.PointLight("light", new BABYLON.Vector3(0, 5, -5), scene);

var pathsToLoadFrom = ["./assets/obj_files_10/", "./assets/obj_files_11/", "./assets/obj_files_12/"];
    
//document.addEventListener("mousedown", push_path, false);


var loader = function(paths){
	this.mesh_pos = -5;
	this.meshs = [];
	for(let i=0; i<paths.length; i++){
		this._run(paths[i]);
		this.mesh_pos += 1;
	}
	
	return this;
};

loader.prototype._run = function(path) {
	BABYLON.SceneLoader.ImportMesh('', './', path, scene, (meshes) => {
		for(let i=0; i < meshes.length; i++){
			let mesh = meshes[i];
			mesh.position.x = this.mesh_pos;
			this.meshs.push(mesh);
		}
	});	
};        
  	
engine.runRenderLoop(function () {
   scene.render();
});

var _l = new loader(pathsToLoadFrom);  

 

Share this post


Link to post
Share on other sites

@Pryme8

At first, line 31 was written BABYLON.SceneLoader.ImportMesh('', './', path, scene, (meshes)=> { , and I received a 403 Forbidden console error that it couldn't load from ././assets/obj_files_10/, so I changed the line to         BABYLON.SceneLoader.ImportMesh('', '', path, scene, (meshes)=> { and then the path was correct. But then I get the message in the console:

BJS - [12:19:45]: Unable to import meshes from ./assets/obj_files_11/: 403 Forbidden

Any Thoughts?

DB

 

 

 

Share this post


Link to post
Share on other sites

looks like its trying to load "./assets/obj_files_11/"

which is not a OBJ file, load the obj file urls into the array and try again.

You can't load folders*, you gotta point to the file.

*you can with some hacking*

So:
var pathsToLoadFrom = ["assets/obj_files_10/file.obj", "assets/obj_files_11/file.obj", "assets/obj_files_12/file.obj"];
and get rid of the ./ in the paths string and leave it in the Loader path declaration.

Share this post


Link to post
Share on other sites

Did you try a path without the './' but '' (it is not useful to put ./)

 BABYLON.SceneLoader.ImportMesh("""", path, scene, (meshes)=> { 

same thing here :

var pathsToLoadFrom = ["assets/obj_files_10/", "assets/obj_files_11/", "assets/obj_files_12/"];

In fact your mistake is that you use a path in importMesh in the file parameter. you do not call any files.

 

 

Share this post


Link to post
Share on other sites

You had to do something like this in the ImportMesh : BABYLON.SceneLoader.ImportMesh('', path, fileOBJ, scene, (meshes) => {

var fileOBJ = ???;

loader.prototype._run = function(path) {
	BABYLON.SceneLoader.ImportMesh('', path, fileOBJ, scene, (meshes) => {
		for(let i=0; i < meshes.length; i++){
			let mesh = meshes[i];
			mesh.position.x = this.mesh_pos;
			this.meshs.push(mesh);
		}
	});	
};      

 

Share this post


Link to post
Share on other sites

That's what I did by resuming your code by adding the files.

var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas);
var scene = new BABYLON.Scene(engine);

scene.clearColor = new BABYLON.Color3(1, 1, 1);
var camera = new BABYLON.FreeCamera("camera", new BABYLON.Vector3(-2.15, 0, -3.2), scene);
camera.minZ = 0.01;
var light = new BABYLON.PointLight("light", new BABYLON.Vector3(0, 5, -5), scene);

var pathsToLoadFrom = ["assets/obj_files_10/", "assets/obj_files_11/", "assets/obj_files_12/"];

// replace the files here by yours
var file = ["files10.obj", "files11.obj", "files12.obj"];


var loader = function(paths, file){
	this.mesh_pos = -5;
	this.meshs = [];
	for(let i=0; i<paths.length; i++){
		this._run(paths[i], file);
		this.mesh_pos += 1;
	}
	
	return this;
};

loader.prototype._run = function(path, file) {
	BABYLON.SceneLoader.ImportMesh('', path, file, scene, (meshes) => {
		for(let i=0; i < meshes.length; i++){
			let mesh = meshes[i];
			mesh.position.x = this.mesh_pos;
			this.meshs.push(mesh);
		}
	});	
};        
  	
engine.runRenderLoop(function () {
   scene.render();
});

var _l = new loader(pathsToLoadFrom, file);  

 

Share this post


Link to post
Share on other sites

you can always do an array like this too
[
{filePath:'Blah/file', fileName:'coolModel.obj'},
{filePath:'Blah/file-location2', fileName:'coolModel2.obj'}
]

and then iterate through that so you don't have two arrays.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.