0

我曾多次尝试使用 a-frame 将导入的对象 (.obj) 放置在虚拟场景中,但不了解其背后的逻辑,也没有找到任何有用的文档。

我创建了一个边长为 1 的立方体,将其居中并向上移动,使其位于 xy 平面的顶部,z 轴穿过其中心(代码如下)。

然而,在场景内部,立方体并没有放在我期望的位置。如果将其放置在位置 (-1 | 0.5 | -3),我希望第一个顶点位于 (-1 + (-0.5) | 0.5 + 0 | -3 + (-0.5) ) = (-1.5 | 0.5 | -3.5 ),我放了一条蓝线。但是,顶点位于 (-1.5 | 0.5 | -3 ) 处,即绿线所在的位置。

我忽略了什么?

对象立方体的代码:

# OBJ file
v -0.5 -0.5 0
v -0.5 -0.5 1
v -0.5 0.5 1
v -0.5 0.5 0
v 0.5 -0.5 0
v 0.5 0.5 0
v 0.5 0.5 1
v 0.5 -0.5 1
g 0-0-0-0
f 1 2 3 4 
f 5 6 7 8 
f 1 5 8 2 
f 4 3 7 6 
f 1 4 6 5 
f 2 8 7 3 

虚拟场景:

<html>
  <head>
    <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>

      <a-assets timeout="10000">
        <a-asset-item id="object-cube1_centered" src="objects/1x1x1x_cube_centered.obj"></a-asset-item>   
      </a-assets>

      <a-entity 
        line="start: -1 0.5 -3; end: -1 2.5 -3; color: red"
        line__2 = "start: -1.5 0.5 -3.5; end: -1.5 2.5 -3.5; color: blue"
      >
      </a-entity>

      <a-entity 
          obj-model="obj: #object-cube1_centered"
          material="color: red"          
          position = "-1 0.5 -3"
        >
        <a-entity 
          line="start: 0 0 0; end: 0 3 0; color: black"
          line__2 = "start: -0.5 0 0; end: -0.5 3 0; color: green"
         >
        </a-entity>
      </a-entity>

      <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
    </a-scene>
  </body>
</html>
4

0 回答 0