首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >导入的网格没有碰撞- Babylon.js

导入的网格没有碰撞- Babylon.js
EN

Stack Overflow用户
提问于 2021-01-28 08:43:11
回答 1查看 518关注 0票数 2

我试图在Babylon.js中设置一个3D环境,但我遇到了一个问题。我用网格创建的槽代码测试了我的环境。

然而,对于真实的环境,我们想要使用搅拌机模型。当我使用场景加载器导入一个网格时,它就会直接掉到地板上。

设置的方式是运行scene.vue脚本,然后呈现Floor.vueBrick.vue组件。

有人知道我的立方体为什么还掉在地板上吗?

Scene.vue

代码语言:javascript
运行
复制
<template>
  <div>
    <camera v-if="scene" v-bind:canvas="canvas" v-bind:scene="scene"/>
    <floor v-if="scene" v-bind:scene="scene" v-bind:canvas="canvas"/>
    <brownie v-if="scene" v-bind:scene="scene" v-bind:canvas="canvas"/>
  </div>
</template>
<script>

import * as BABYLON from 'babylonjs';
import Camera from './Camera.vue';
import Brownie from './Brownie';
import Floor from './Floor';

export default {
  name: "Scene",
  components:{
    Camera,
    Floor,
    Brownie,
  },

  props: ["canvas"],
  data(){
    return {
      engine: null,
      scene: null
    }
  },

  mounted() {
    this.engine = new BABYLON.Engine(
        this.canvas,
        true,
        {
          preserveDrawingBuffer: true,
          stencil: true,
        },
    );

    this.scene = new BABYLON.Scene(this.engine);
    this.scene.enablePhysics();
    this.scene.collisionsEnabled = true;
    new BABYLON.HemisphericLight('light1', new BABYLON.Vector3(0, 1, 0), this.scene);


    this.engine.runRenderLoop(() => {
      this.scene.render();
    });
  },
}

</script>

Floor.vue

代码语言:javascript
运行
复制
<template>
  <div>
  </div>
</template>

<script>
import * as BABYLON from 'babylonjs';

export default {
  name: "Floor",
  props: ["scene", "canvas"],

  methods: {
    generateFloor(){
      let floor = BABYLON.MeshBuilder.CreateGround('floor', {width: 50, height: 50});
      floor.position = new BABYLON.Vector3(0, 0, 0);
      floor.physicsImpostor = new BABYLON.PhysicsImpostor(floor, BABYLON.PhysicsImpostor.BoxImpostor, {mass: 0, friction:0.1, restitution:0.8}, this.scene);
    }
  },

  mounted() {
    this.generateFloor();
  }
}
</script>

<style scoped>
</style>

Brownie.vue

代码语言:javascript
运行
复制
<template>
  <div>
  </div>
</template>

<script>
import * as BABYLON from 'babylonjs';
import 'babylonjs-loaders';

export default {
  name: "Brownie",
  props: ["scene", "canvas"],

  methods: {
    generateBrownie(){
      // let testObj = BABYLON.MeshBuilder.CreateBox('floor', {width: 1, height: 1});
      // testObj.position = new BABYLON.Vector3(5, 10, 0);
      // testObj.physicsImpostor = new BABYLON.PhysicsImpostor(testObj, BABYLON.PhysicsImpostor.BoxImpostor, {mass: 1, friction:0.1, restitution:0.8}, this.scene);

      BABYLON.SceneLoader.ImportMesh("", "./", "cube.glb", this.scene, (newMeshes) => {
        let mesh = newMeshes[0];
        this.scene.meshes.forEach(mesh => {
          mesh.checkCollisions = true;
        });
        mesh.position.x = 0;
        mesh.position.y = 2;
        mesh.position.z = 0;
        mesh.physicsImpostor = new BABYLON.PhysicsImpostor(mesh, BABYLON.PhysicsImpostor.BoxImpostor, {mass: 1, friction:0.1, restitution:0.8}, this.scene);
        this.scene.mesh.checkCollisions = true;
      });
    }
  },

  mounted() {
    this.generateBrownie();
  }
}
</script>

<style scoped>
</style>
EN

回答 1

Stack Overflow用户

发布于 2022-03-04 07:21:51

在你的Floor.vue中,你需要为你的地板启用碰撞,就像这样,

代码语言:javascript
运行
复制
methods: {
    generateFloor(){
      let floor = BABYLON.MeshBuilder.CreateGround('floor', {width: 50, height: 50});
      floor.position = new BABYLON.Vector3(0, 0, 0);
      floor.physicsImpostor = new BABYLON.PhysicsImpostor(floor, BABYLON.PhysicsImpostor.BoxImpostor, {mass: 0, friction:0.1, restitution:0.8}, this.scene);
      floor.checkCollisions = true;
    }
  },

我希望这能帮上忙!

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/65933675

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档