BabylonJS-从JSON文件加载网格

问题描述

我会迅速否认我是BabylonJS的新用户。

我正在尝试构建一个基本系统，在该系统中，我们可以将数据放入JSON文件中，并通过XHR调用读取数据并使用巴比伦进行呈现。我以为我会从简单开始，但要使用实际的网格物体，因为最终产品将需要加载它们。我加载并使用了一些常规的网格物体，但效果有限。

即使将两个对象分离并正确渲染，似乎也正在发生，当解释缩放和定位数据时，它将为两个对象绘制相同的值。成功回调是独立的，我不确定每个任务的onSuccess回调是如何处理的。我本来只是在循环中渲染资产，但是那没有用，所以我转而尝试使用AssetManager几乎没有变化。当我从其他.js文件引入JSON时，它已被正确设置并正确加载到全局g_oComponents中。以下是相关代码：

var canvas = document.getElementById("renderCanvas"); // Get the canvas element
var engine = new BABYLON.Engine(canvas,true); // Generate the BABYLON 3D engine
var scene = new BABYLON.Scene(engine);

var createScene = function() {
    var assetsManager = new BABYLON.AssetsManager(scene);
    var components = {}; 

    scene.clearColor = new BABYLON.Color3(.5,.5,.5);
    //scene.debugLayer.show();

    // camera
    var camera = new BABYLON.ArcRotateCamera("camera1",new BABYLON.Vector3(2,3,4),scene);
    camera.setPosition(new BABYLON.Vector3(10,-10));
    camera.attachControl(canvas,true);

    // lights
    var light = new BABYLON.HemisphericLight("light1",new BABYLON.Vector3(1,0.5,0),scene);
    light.intensity = 0.8;

    // Start Components
    console.log(g_oComponents);
    for(meshKey in g_oComponents) {
        var thisComponent = g_oComponents[meshKey];
        components[meshKey] = g_oComponents[meshKey];
        
        // Create the Mesh
        components[meshKey].task = assetsManager.addMeshTask(meshKey+" task","",model.meshURL,model.meshFile);
        
        // Set task callbacks
        components[meshKey].task.onError = function(task,message,exception) {
            console.log(message,exception);
        }
        components[meshKey].task.onSuccess = function(thisTask) {
            if(typeof components[meshKey].scale != "undefined") {
                thisTask.loadedMeshes[0].scaling = new BABYLON.Vector3(
                    components[meshKey].modeling.scale.x,components[meshKey].modeling.scale.y,components[meshKey].modeling.scale.z
                );
            }

            thisTask.loadedMeshes[0].position = setMeshPosition(
                g_oComponents,components[meshKey].positioning
            );

            thisTask.loadedMeshes[0].computeWorldMatrix(true);
        }   
    }
    assetsManager.load();
    
    assetsManager.onFinish = function () {
        // Register a render loop to repeatedly render the scene
        engine.runRenderLoop(function () {
            scene.render();
        });
    }

    return scene;
}
/******* End of the create scene function ******/

function setMeshPosition(p_oExistingComponents,p_oPositioningData) {
    pData = p_oPositioningData;
    components = p_oExistingComponents;
    if(pData.relativeTo == "world") {  // If set to "world" use distanceOffset as absolute positioning
        newX = pData.distanceOffset.x;
        newY = pData.distanceOffset.y;
        newZ = pData.distanceOffset.z;
    } else {
        if(typeof components[pData.relativeTo] != 'undefined') {
            console.log("Trying to add the relative distance vector");
            newX = components[pData.relativeTo].positioning.distanceOffset.x + pData.distanceOffset.x;
            newY = components[pData.relativeTo].positioning.distanceOffset.y + pData.distanceOffset.y;
            newZ = components[pData.relativeTo].positioning.distanceOffset.x + pData.distanceOffset.z;
        } else {  // Default to 0,0
            newX = 0;
            newY = 0;
            newZ = 0;
        }
    }
    return new BABYLON.Vector3(newX,newY,newZ);
}

这是g_oComponents的统一console.log表达式：

g_oComponents: {
  CG5: {
    ident: {
      type: "floater",name: "CG5"
    },{
    modeling: {
      meshURL: "assets/meshes/shaderBall/",meshFile: "BabylonShaderBall_Simple.gltf",scale: {
        x: 0.01,y: 0.01,z: 0.01
      }
    },{
    positioning: {
      relativeTo: "listener",distanceOffset: {
        x: 4,y: -10,z: 4
      }
    }
  },{
  listener: {
    ident: {
      type: "listener",name: "listener"
    },{
    modeling: {
      meshURL: "assets/meshes/Skull/",meshFile: "skull.babylon",{
    positioning: {
      relativeTo: "world",distanceOffset: {
        x: 0,y: 0,z: 0
      }
    }
  }
}

我确定我只是在处理有关如何使用API​​的基本误解。任何帮助都将不胜感激！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）