a-frame vr如何拖放资产/元素洞察图片?

时间:2016-10-09 02:18:49

标签: aframe webvr

我正在尝试使用a-frame而无法找到有关如何拖放元素的内容,并且已经找了好几个小时!有人熟悉a-frame吗? 感谢

到目前为止我的代码:

<a-scene>
    <a-cursor></a-cursor>
 <a-assets>
  <img id="enemy-sprite" crossorigin="" src="mustache1.jpg">
 </a-assets>
 <a-image look-at="#player" src="#enemy-sprite" transparent="true" position="0 1.8 -4"></a-image>
 <a-camera id="player" position="0 1.8 0"></a-camera>
 <a-sky src="street.jpg"></a-sky>

编辑: 浏览器/ home.html的:

  <scene scene-id="sceneId"></scene>

浏览器/ JS /应用程序/指令/ screne.html:

  <a-scene>
    <a-sphere click-drag position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
    <a-camera look-controls-enabled="false"></a-camera>
  </a-scene>

的index.html

<script src="https://aframe.io/releases/0.3.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-click-drag-component"></script>
<script>  registerAframeClickDragComponent(window.AFRAME); </script>

1 个答案:

答案 0 :(得分:6)

这不是内置于Aframe中,但您可以使用第三方组件来获得所需的结果。

aframe-click-drag-component允许在屏幕上点击并拖动实体:

  

可以在3D场景周围单击并拖动具有click-drag组件的实体。甚至可以在相机移动或旋转时工作!

<head>
  <script src="https://aframe.io/releases/0.3.0/aframe.min.js"></script>
  <script src="https://unpkg.com/aframe-click-drag-component"></script>
  <script>
    registerAframeClickDragComponent(window.AFRAME);
  </script>
</head>

<body>
  <a-scene>
    <a-sphere click-drag position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
    <a-camera look-controls-enabled="false"></a-camera>
  </a-scene>
</body>

查看the demo