如何在A-Frame中添加导航路径?

发布于 2025-01-11 04:14:08 字数 1217 浏览 0 评论 0原文

我尝试了各种 A 形框架的方法,但是,我无法找到一个好的方法来制作一条路径,使头像无法走出该路径,也无法穿过场景中存在的墙壁和物体。我尝试使用搅拌机制作自己的导航网格,但也许我错过了一些东西。

所以请帮我解决 A-Frame 中的问题!!

 <a-scene
      inspector-plugin-recast
      renderer="antialias: true;
    colorManagement: true;
    sortObjects: true;
    physicallyCorrectLights: true;
    highRefreshRate: true;"
    >
      <a-assets>
        
        <a-asset-item id="rig" src="./navmesh.gltf"></a-asset-item>
      </a-assets>
      

      <a-entity
        id="rig"
        movement-controls="speed:0.15; constrainToNavMesh: true"
        position="0 0 5"
      >
        <a-entity
          camera
          position="0 1.6 0"
          look-controls="pointerLockEnabled: true"
        >
          <a-cursor nav-pointer raycaster="objects: [nav-mesh]"></a-cursor>
        </a-entity>
      </a-entity>
      <a-entity gltf-model="#rig" nav-mesh visible="false"></a-entity>
    </a-scene>

navmesh.gltf 是为相机提供导航路径,以便相机无法超出此网格。我使用生成的这个 gltf

aframe-inspector-plugin-recast.js。

所以,它可以工作,但是当我制作自己的导航网格并添加它时,要么浏览器没有加载场景,要么我的相机总是在场景之外。

I tried various ways A-Frame but, I can't able to get a good way to make a path so that avatar can't go outside that and also can't pass through walls and objects which are there in the scene. I tried to make my own navmesh using blender but maybe I'm missing something.

So please help me regarding this in A-Frame !!

 <a-scene
      inspector-plugin-recast
      renderer="antialias: true;
    colorManagement: true;
    sortObjects: true;
    physicallyCorrectLights: true;
    highRefreshRate: true;"
    >
      <a-assets>
        
        <a-asset-item id="rig" src="./navmesh.gltf"></a-asset-item>
      </a-assets>
      

      <a-entity
        id="rig"
        movement-controls="speed:0.15; constrainToNavMesh: true"
        position="0 0 5"
      >
        <a-entity
          camera
          position="0 1.6 0"
          look-controls="pointerLockEnabled: true"
        >
          <a-cursor nav-pointer raycaster="objects: [nav-mesh]"></a-cursor>
        </a-entity>
      </a-entity>
      <a-entity gltf-model="#rig" nav-mesh visible="false"></a-entity>
    </a-scene>

navmesh.gltf is to give the navigation path to the camera so that is could not go outside this mesh. This gltf i've generated by using

aframe-inspector-plugin-recast.js.

So, it's working but when I'm making my own navmesh and adding it then, either browser didn't load the scene or my camera always goes outside it.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

老娘不死你永远是小三 2025-01-18 04:14:08

这是关于 navmesh 概念的很好的教程:
https://www.youtube.com/watch?v=Y52czIft9OU

其他非更简单的创建类似于 navmesh 的系统的方法是使用 Ammo.js 等物理系统,该系统广泛用于 AR/VR 游戏开发。
您基本上会在竞技场周围创建墙壁,以便化身不会超出它。您可以设置 ammo-body 将墙壁设为静态,将头像设为动态。
虽然碰撞逻辑需要一个 collider,但有您可以研究并测试许多不同的方法,找出最适合您的方法。

This is a good tutorial on the concept of navmesh:
https://www.youtube.com/watch?v=Y52czIft9OU

Other non simpler ways to create a system similar to navmesh is by using physics systems like Ammo.js which is used widely for game development in AR/VR.
You would basically create walls around your arena so that the avatar does not go beyond it. You can set the ammo-body for the walls to static and the avatar to dynamic.
While the collision logic would need a collider, there are many different ones you can research and test out what works for you the best.

庆幸我还是我 2025-01-18 04:14:08

提问者确实需要一个导航网格。但是,对于那些寻找标题问题(如何使某物沿着预定路径移动)答案的人,请参阅此存储库以及包含的 follow-path 组件:
https://github.com/kylebakerio/aframe-curve-component

The question asker really does need a nav mesh. However, for those looking for an answer to the headline question (how to make something move along a predetermined path), see this repo, and the included follow-path component:
https://github.com/kylebakerio/aframe-curve-component

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文