【发布时间】：2015-11-29 03:19:45
【问题描述】：
我想使用 Babylon.js 加载用户上传的文件。我环顾四周，但只能找到加载巴比伦场景文件的示例。
有没有一种方法可以直接使用 Babylon.js 加载 .obj 和/或 .stl 文件，而无需将它们转换为 .babylon 文件？
谢谢。
【问题讨论】：
标签： babylonjs
【发布时间】：2015-11-29 03:19:45
【问题描述】：
为了减小框架大小，Babylon.js 不包含文件加载器。但是你可以去那里使用我们的加载器之一：https://github.com/BabylonJS/Babylon.js/tree/master/loaders
【讨论】：
-
大卫，你不能也使用本地转换工具吗？ IE。 github.com/BabylonJS/Babylon.js/tree/master/Exporters（参见 XNA-OBJ 目录下的自述文件）。看来您需要编译 C# 代码，或使用在该 github 目录中找到的现成二进制文件。 （顺便说一句，代码会在 Linux 上用 Mono 编译吗？）
-
这是一个选项，但您不会对进程有太多控制权，而且由于 xna 依赖关系，这只适用于 windows
您尝试过资产管理器吗？它可以自动解决您的问题。简而言之，它只是一个由漂亮的加载屏幕填充的加载数据的数组，更多信息在这里：https://github.com/BabylonJS/Babylon.js/wiki/Using-AssetsManager
<!DOCTYPE html>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Babylon.js sample code assetsManager loading</title>
<!-- Babylon.js -->
<script src="index_subory/hand.js"></script>
<script src="index_subory/cannon.js"></script>
<script src="index_subory/oimo.js"></script>
<script src="index_subory/babylon.2.0.debug.js"></script>
<script src="index_subory/jquery.min.js"></script>
<style>
html, body {
overflow: hidden;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#renderCanvas {
width: 100%;
height: 100%;
touch-action: none;
}
</style>
</head>
<body>
<div style="background-color:grey;color:white;font-weight:bold;margin-left:auto;margin-right:auto;text-align:center;">Pre prehliadače s WebGL: WebGL Javascript pokus v babylon.js - ovládaj šípkami na klávesnici a ťahaním myškou:<br><div style="background-color:grey;color:white;font-weight:bold;">The Pulse [Ak nevidíte video, chyba je v prehliadači, ľutujeme, možno novší to zvládne ;-) ] </div></div>
<canvas height="782" width="1440" id="renderCanvas"></canvas>
<script>
var canvass = $('#renderCanvas');
// check to see if we can do webgl
// ALERT FOR JQUERY PEEPS: canvas is a jquery obj - access the dom obj at canvas[0]
var dcanvas = canvass[0];
expmt = false;
if ("WebGLRenderingContext" in window) {
//alert("browser at least knows what webgl is.");
}
// some browsers don't have a .getContext for canvas...
try {
gl = dcanvas.getContext("webgl");
}catch (x){
gl = null;
}
if (gl == null) {
try {
gl = dcanvas.getContext("experimental-webgl");
}catch (x){
gl = null;
}
if (gl == null) {
//console.log('but can\'t speak it');
}else {
expmt = true; //alert('webgl experimentally.');
}
} else {
//alert('webgl natively');
}
if (gl || expmt) {
//alert("loading webgl content.");
} else {
alert("CHYBA: Váš prehliadač nepodporuje WebGL, ľutujeme. (ERROR: Your browser does not support WebGL, sorry.)");
canvas.remove();
}
if (BABYLON.Engine.isSupported()) {
var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas, true);
var scene = new BABYLON.Scene(engine);
var sphere1 = BABYLON.Mesh.CreateSphere("Sphere1", 1.0, 1.0, scene);
var createScene = function () {
// setup environment
var light0 = new BABYLON.PointLight("Omni", new BABYLON.Vector3(0, 10,80), scene);
var camera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 0, -30), scene);
var light2 = new BABYLON.PointLight("Omni", new BABYLON.Vector3(10, 10, -80), scene);
var simpleMaterial = new BABYLON.StandardMaterial("texture2", scene);
simpleMaterial.diffuseColor = new BABYLON.Color3(0, 1, 0);//Green
sphere1.material = simpleMaterial;
sphere1.position.x=-4;
sphere1.position.z=-4;
sphere1.position.y=4.5;
camera.position.x = -9;
camera.position.y = 4;
camera.position.z = -10;
camera.rotation.x = .28;
camera.rotation.y = .707;
camera.rotation.z = 0;
camera.speed = .2;
camera.attachControl(canvas);
var ecran = BABYLON.Mesh.CreatePlane("impact", 8, scene);
ecran.rotation.z = 2*Math.PI;
// Video material
var videoMat = new BABYLON.StandardMaterial("textVid", scene);
videoMat.diffuseTexture = new BABYLON.VideoTexture("video", ["index_subory/v.ogv"], 256, scene, false);
videoMat.backFaceCulling = false;
ecran.material = videoMat;
// Mirror
//var mirror = BABYLON.Mesh.CreateBox("Mirror", 1.0, scene);
var mirror = BABYLON.Mesh.CreateGround("gnd", 16, 16, 1, scene, true);
// var mirror = BABYLON.Mesh.CreatePlane("Mirror", 5.0, scene);
mirror.position = new BABYLON.Vector3(0, -0.5, 0);
mirror.material = new BABYLON.StandardMaterial("mirror", scene);
mirror.material.backFaceCulling = false;
// mirror.material.diffuseColor = new BABYLON.Color3(0.0, 0, 0.1);
mirror.material.reflectionTexture = new BABYLON.MirrorTexture("mirror", 512, scene, true);
mirror.material.reflectionTexture.mirrorPlane = new BABYLON.Plane(0, -1.0, 0, -1.0);
mirror.material.reflectionTexture.renderList = [ecran,sphere1];
mirror.material.reflectionTexture.level = 1;
//mirror.material.reflectionTexture.coordinatesMode = BABYLON.Texture.PROJECTION_MODE;
return scene;
}
var scene = createScene();
var assetsManager = new BABYLON.AssetsManager(scene);
var binaryTask = assetsManager.addBinaryFileTask("binary task", "index_subory/v.ogv");
//engine.displayLoadingUI();
engine.loadingUIText = "Loading... (Načítavanie...)";
assetsManager.onTaskSuccess = function (task) {
// Do something with task.data.
//engine.hideLoadingUI();
};
assetsManager.onTaskError = function (task) {
// Do something with task.data.
alert('Error with loading by assetsManager...');
};
assetsManager.onFinish = function (task) {
//engine.hideLoadingUI();
engine.runRenderLoop(function () {
scene.render();
sphere1.rotation.y+=0.05;
});
};
assetsManager.load();
// Resize
window.addEventListener("resize", function () {
engine.resize();
});
}else{
alert("Chyba: Nemôžem spustiť WebGL. (Error: Can't run WebGL.)");
}
</script>
</body></html>
这是我的代码，用于预加载带有漂亮加载消息的视频，然后呈现场景。
【讨论】：
-
代码太长（无聊）...你能更新并只发布相关部分吗？