标签: aframe
如何更改对象A-Frame的轴心点,变换原点或旋转点？
当我画一个<a-box>.本地化是盒子的中心.旋转围绕盒子的中心旋转.如何更改旋转点？
<a-box rotation="0 45 0"></a-box>
推荐指数
解决办法
查看次数
iOS/Safari 上的 HLS 视频流
我正在尝试在 safari iOS 上使用 Aframe 流式传输 hls，其中 Aframe 在后台具有三个.js。但视频显示黑屏，仅播放音频。视频 src 的类型为 .m3u8。我试图通读很多相关的帖子，但似乎没有一个合适的解决方案。让 HLS 和 WebGL 在 iOS 上运行是一种一厢情愿的想法吗？如果没有，请有人帮我解决一个问题。
关于 github 上可用问题的一些讨论：
推荐指数
解决办法
查看次数
如何在Aframejs中加载3D模型？它目前在threejs中工作正常
我创建了一个3D动画模型,我设法在threejs中运行.
var loader = new THREE.FBXLoader();
loader.load( 'model.fbx', function ( object ) {
object.mixer = new THREE.AnimationMixer( object );
mixers.push( object.mixer );
console.log(object.animations.length);
var action = object.mixer.clipAction( object.animations[ 0 ] );
action.play();
object.traverse( function ( child ) {
if ( child.isMesh ) {
child.castShadow = true;
child.receiveShadow = true;
}
});
scene.add( object );
});
它在threejs上运行得非常好,但是如何在aframe中使用它,我正在尝试创建AR应用程序.我没有得到足够的文档,在AFrame中我可以在标记上显示obj模型但是aframe-extras似乎不起作用,但Threejs FBX加载程序工作正常.我需要帮助才能在标记扫描上显示三个场景.
推荐指数
解决办法
查看次数
A 型框架，AR.JS。如何在 NFT-Marker 中定位对象？
我在将视频元素定位在 NFT 标记区域内时遇到问题。仔细研究了 AR.JS 和 AFRAME 文档，但没有成功。
问题：在具有不同屏幕分辨率和相机分辨率的每个设备上，视频的位置不同。如果我根据我的 PC 网络摄像头设置 sourceWidth、sourceHeight、displayWidth、displayHeight，我将无法再在智能手机上看到该对象，因为它会在屏幕外渲染。
第二个问题是使视频元素的大小与标记完全相同。在不同的设备和相机上，视频大小是不同的。
我的代码几乎与 ar.js 存储库中的 nft 示例类似。
<script src="https://cdn.jsdelivr.net/gh/aframevr/aframe@c5eabc1ac708a76a0dbe9538c40ecd290af65714/dist/aframe-master.js"></script>
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js"></script>
<script>
window.onload = function() {
AFRAME.registerComponent('videohandler', {
init: function () {
var marker = this.el;
this.vid = document.querySelector("#vid");
marker.addEventListener('markerFound', function () {
this.vid.play();
}.bind(this));
marker.addEventListener('markerLost', function() {
this.vid.pause();
this.vid.currentTime = 0;
}.bind(this));
}
});
};
</script>
<body style="margin: 0px; overflow: hidden">
<a-scene vr-mode-ui="enabled: false;" renderer="logarithmicDepthBuffer: false; " embedded arjs="trackingMethod: best; sourceType: webcam; debugUIEnabled: false; sourceWidth:414; sourceHeight:736; displayWidth: …推荐指数
解决办法
查看次数
aframe - 在运行时设置相机位置
在 a-scene 中，我尝试在运行时更改我的相机位置。DOM 属性发生变化，但相机不会移动。
我会错过什么？
我的js代码：
document.querySelector('#myCameraPosition').setAttribute('position', '0 0 0');
我的场景：
<a-entity id="myCameraPosition" position="0 0 50">
<a-entity id="myCamera" camera look-controls keyboard-controls>
</a-entity>
</a-entity>
推荐指数
解决办法
查看次数
为什么 A-Frame 中的 HTML/DOM 没有更新？
我正在做setAttribute或$.attr()在 A-Frame 中的实体上。例如，
el.setAttribute('position', '2 2 2');
位置更新，但我没有看到它在 HTML/DOM 检查器中更新。我刚定<a-entity position>怎么来的？
推荐指数
解决办法
查看次数
Aframe 注销组件
我正在学习如何使用 React 和 Redux 构建框架。我正在创建自定义组件并将它们注册到我的reactjs componentWillMount 生命周期事件中。例如：我将光线投射的结果发送到父级 React 组件，以保存用于其他目的。这很好用。
import React, {Component, PropTypes} from 'react'
export default class AframeComponent extends Component {
static propTypes = {
cb: PropTypes.func.isRequired
}
componentWillMount () {
const {AFRAME} = window
const aframeComponent = this
if (!AFRAME) return
if (!AFRAME.components['sphere-listener']) {
AFRAME.registerComponent('sphere-listener', {
init () {
const {el} = this
el.addEventListener('mouseup', (evt) => {
const camera = document.querySelector('#camera')
aframeComponent.handleRaycast(evt.detail.intersection.point, camera.components.rotation)
})
}
})
}
}
handleRaycast (position, rotation) {
const {cb} = this.props
/* do …推荐指数
解决办法
查看次数
获取边界框或模型中心
我想知道是否有办法获得通过3dio.js插入的模型的边界框,或者计算其中心点？我希望将它们放在原点上.
下图显示了相对于红框指示的场景原点的两个模型.
推荐指数
解决办法
查看次数
如何使用Oculus Go触控板在AFrame中移动
我正在使用Oculus Go测试一些AFrame页面，但是无法使触控板在场景中移动。我使用的是AFrame的主版本，显然支持Oculus Go控制器。实际上，此代码例如：
<!DOCTYPE html>
<html>
<head>
<script src="https://rawgit.com/aframevr/aframe/cf15c15/dist/aframe-master.min.js"></script>
</head>
<body>
<a-scene anti-alias>
<a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9" shadow></a-box>
<a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E" shadow></a-sphere>
<a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D" shadow></a-cylinder>
<a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" shadow></a-plane>
<a-sky color="#ECECEC"></a-sky>
<a-entity laser-controls="hand: right"></a-entity>
<a-entity oculus-go-controls x-button-listener></a-entity>
<a-entity camera look-controls wasd-controls position="0 1.6 0"></a-entity>
</a-scene>
</body>
</html>
在图像中显示了控制器，但显然并没有像我在台式机版本中使用wasd那样对使用的触控板产生影响（相对于遍历场景而言，效果很好）。
因此，总而言之，我如何在AFrame场景中使用Oculus Go触控板在其中移动，就像在桌面使用wasd键一样？（或者，也许AFrame仍不支持此功能？）
[我知道这类似于AFrame Oculus Go Controller文档吗？，但我对移动方式更感兴趣。]
推荐指数
解决办法
查看次数
Aframe Systems[name] 不是构造函数
我有一个 aframe 项目，它是 React 应用程序的一部分并且工作正常。
由于各种问题，我正在尝试分离各层
我已将 aframe 场景直接添加到 HTML 文档中
<body>
<div id="root" style="height: 100%; width: 100%">
</div>
<a-scene>
</a-scene>
</body>
React 部分渲染良好，但 AFRAME 崩溃了
类型错误：系统[名称]不是构造函数
从
this.systems[name] = new systems[name](this);
this.systemNames.push(name);
aframe 库是通过 Webpack 导入的。
有什么想法可能导致这种情况吗？
推荐指数
解决办法
查看次数