3dmax模型在web端

大家都知道3dmax是制作模型如果学会了,ps也就可以不用学了
但是在web端应用少
所以今天讲解一下导入web端

3dmax生成软件后就
生成2个文件:xx.mtl和xx.obj

将二个文件放到你的web也面
因为是模型所以都知道必须是用到three.js 3D模型js
具体代码
我在其中加入键盘事件使之动起来,
因为工作马上离开原因把自己弄过的项目和代码写一下要不会忘记


	
	
	实现3dmax模型
	
	
	




	

// mesh.rotation.y += 0.01; //添加动画
// mesh.rotation.z += 0.01;
// mesh.rotation.x += 0.01;
if(mesh.rotation.y > Math.PI * 2) {
mesh.rotation.y -= Math.PI * 2;
}

}

// 键盘控制 上下左右
document.onkeydown = function(event) {
	var e = event || window.event || arguments.callee.caller.arguments[0];
	if(e && e.keyCode == 37) { // 左
		mesh.rotation.z += 0.05;
	}
	if(e && e.keyCode == 38) { // 上 逆时针
		mesh.rotation.y += 0.05;
	}
	if(e && e.keyCode == 39) { // 右
		mesh.rotation.z -= 0.05;
	}
	if(e && e.keyCode == 40) { // 下 顺时针
		mesh.rotation.y -= 0.05;
	}
	
	if(e && e.keyCode == 81) { // 前q
		 mesh.rotation.x += 0.05;
	}
	if(e && e.keyCode == 72) { // 后h
		mesh.rotation.x -= 0.05;
	}
};

// 模型
var onProgress = function(xhr) {
	if(xhr.lengthComputable) {
		var percentComplete = xhr.loaded / xhr.total * 100;
		console.log(Math.round(percentComplete, 2) + '% downloaded');
	}
};
var onError = function(xhr) {};
THREE.Loader.Handlers.add(/\.dds$/i, new THREE.DDSLoader());
var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath('/uploads/160601/obj/');
mtlLoader.load('绿色茶壶.mtl', function(materials) {
	materials.preload();
	var objLoader = new THREE.OBJLoader();
	objLoader.setMaterials(materials);
	objLoader.setPath('/uploads/160601/obj/');
	objLoader.load('绿色茶壶.obj', function(object) {
		object.position.y = -0.5;
		//object.position.x = -10;
		//object.position.z = -10;
		scene.add(object);
	}, onProgress, onError);
});

你可能感兴趣的:(web前端)