Question

我正在尝试用按钮在我的babylon.js场景中显示/隐藏网格物体。我假设我可以创建一个显示/隐藏网格的函数，然后从我的页面调用所述按钮来影响我的场景并写下以下内容：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<script src="assets/js/babylon.js"></script>
<script src="assets/js/hand-1.3.8.js"></script>
<script src="assets/js/cannon.js"></script>  <!-- optional physics engine -->

</head>
<body>
    <div id="container">
        <!-- Page Content -->
        <div id="content">
      <div id="tableBuilder">

        <div id='cssmenu'>
          <ul id="tops">
            <button type="button" onclick="showTop('T115')">Round</button>
            <button type="button" onclick="showTop('T345')">Rectangular</button>
          </ul>
        </div>
              <canvas id="renderCanvas"></canvas>
      </div>
    </div>
  </div>
  <script>


    if (BABYLON.Engine.isSupported()) {
      var myNewScene = null;
      var canvas = document.getElementById("renderCanvas");
      var engine = new BABYLON.Engine(canvas, true);

     BABYLON.SceneLoader.Load("", "test.babylon", engine, function (newScene) {

        myNewScene = newScene;

        var meshT115 = newScene.getMeshByName("T115").visibility = 0;
        var mesh510 = newScene.getMeshByName("510").visibility = 1;
        var meshT345 = newScene.getMeshByName("T345").visibility = 1;
        var mesh350 = newScene.getMeshByName("350").visibility = 0;

        var myBaseMesh = newScene.getMeshByName("510");
        var materialMyMesh = new BABYLON.StandardMaterial("texture1", newScene);
        materialMyMesh.diffuseTexture = new BABYLON.Texture("assets/images/stain/Natural.jpg", newScene);
        materialMyMesh.specularPower = 50;
        myBaseMesh.material = materialMyMesh;

        var myTopMesh = newScene.getMeshByName("T345");
        var materialMyMesh = new BABYLON.StandardMaterial("texture2", newScene);
        materialMyMesh.diffuseTexture = new BABYLON.Texture("assets/images/stain/Natural.jpg", newScene);
        materialMyMesh.specularPower = 50;
        myTopMesh.material = materialMyMesh;

        // Wait for textures and shaders to be ready
        newScene.executeWhenReady(function () {
          // Attach camera to canvas inputs
          var myCamera = new BABYLON.ArcRotateCamera("ArcRotateCamera", 1.2, 1.2, 5, new BABYLON.Vector3(0, 0.1, 0.1), newScene); 
          myCamera.wheelPrecision = 10;

          var light0 = new BABYLON.HemisphericLight("Hemi0", new BABYLON.Vector3(0, 50, 0), newScene);
          light0.diffuse = new BABYLON.Color3(1, 1, 1);
          light0.specular = new BABYLON.Color3(1, 1, 1);
          light0.groundColor = new BABYLON.Color3(.5, .5, .5);

          newScene.activeCamera = myCamera;

          newScene.activeCamera.attachControl(canvas);

          // Once the scene is loaded, just register a render loop to render it
          engine.runRenderLoop(function() {
              newScene.render();
          });
        });
      }, function (progress) {
          // To do: give progress feedback to user
      });
    }

    function showTop (x) {
      myNewScene.getMeshById("myTopMesh").visibility = 0;
      myNewScene.getMeshById(x).visibility = 1;
    }  
  </script>
</body>

</html>

然而，我得到的只是一个错误。

Uncaught TypeError: undefined is not a function 
    showTop    3d.php::88
    onclick    3d.php::88

第88行是：

myNewScene.getMeshById(x).visibility = 1;

我的问题是，如果我将myNewScene声明为全局变量，然后在我的场景创建中分配它，为什么我的浏览器认为它应该是一个函数？

感谢。

Answer 1

改变这个：

  if (BABYLON.Engine.isSupported()) {
  var myNewScene = null;
  var canvas = document.getElementById("renderCanvas");
  var engine = new BABYLON.Engine(canvas, true);

这样的事情：

var myNewScene, canvas, engine;
if (BABYLON.Engine.isSupported()) {
  myNewScene = null;
  canvas = document.getElementById("renderCanvas");
  engine = new BABYLON.Engine(canvas, true);

添加一个按钮来改变babylon.js中的网格

1 个答案: