对于与A-Frame(aframe.io)相关的任何事情。 A-Frame是用于构建虚拟现实体验的Web框架。 A-Frame允许我们使用HTML构建场景,同时可以无限制地访问JavaScript,three.js和所有现有的Web API。 A-Frame是一个实体组件系统框架,可以促进组合和可扩展性。使用WebVR,大多数耳机/控制器可以与A-Frame一起使用:Vive,Rift,Daydream,GearVR,Cardboard或普通2D模式。
我只是想插入我的模型进行预览,但我不是开发人员,无法弄清楚为什么它没有显示。 这是我的 html 代码; <question vote="0"> <p>我只是想插入我的模型进行预览,但我不是开发人员,无法弄清楚为什么它没有显示。</p> <p>这是我的html代码;</p> <pre><code> <html> <head> <script src="https://aframe.io/releases/1.5.0/aframe.min.js"></script> <script src="https://unpkg.com/<a href="/cdn-cgi/l/email-protection" data-cfemail="21404753404c440c4459555340520f404f484c4055484e4f0c4c4859445361120f150f11">[email protected]</a>/dist/aframe-extras.animation-mixer.js"></script> </head> <body> <a-scene background="color: #ECECEC"> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-robot id="robot" position="-5 0.5 -3" src="https://cdn.glitch.global/a268f0f6-f14a-489d-b3cb-558fda9ac16b/scene-can.gltf?v=1712935681643" ></a-robot> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="red" ></a-plane> </a-scene> </body> </html> </code></pre> <p>这是上传的资源。</p> <p><img src="https://cdn.txt58.com/i/AWkuc3RhY2suaW1ndXIuY29tL01ZQUNSLnBuZw==" alt="assets"/></p> <p>我根本无法让我的 3D 模型出现。 谁能帮我设置一下吗?</p> </question> <answer tick="false" vote="0"> <p>元素<pre><code>a-robot</code></pre>在A-Frame中不存在,除非你自己定义它。您可能需要仔细检查 <a href="https://aframe.io/docs/1.5.0/primitives/a-gltf-model.html" rel="nofollow noreferrer"><pre><code>a-gltf-model</code></pre> 文档</a>,检查您的 JavaScript 控制台是否有任何错误并在问题中分享它们,或者进一步解释您遇到的问题。大多数模型都需要照明,而您当前的场景不包括照明。</p> <p>旁白:如果您只想显示模型而无需进一步自定义,类似 <a href="https://modelviewer.dev/" rel="nofollow noreferrer">https://modelviewer.dev/</a> 可能是一种更简单的方法。</p> </answer> </body></html>
//让我解释一下代码的作用,有两个盒子,一蓝一绿,当你点击绿色盒子时,蓝色盒子会在空中移动一圈,上面有12个点的...
我无法在自定义 aframe 组件中获取 aframe 文本组件的高度/宽度。文本出现在我的场景中,我能够控制台记录“几何”和“材质”
如何在 Aframe 中将框的位置设置为变量或设置位置 x、y-10、z?
我想避免尝试使用重力,但如果需要的话,也没关系。我正在尝试制作一款类似堆垛机街机游戏的游戏,但在 Aframe 中。我找不到设置盒子位置的方法...
为什么 mouseenter 和 mouseleave startEvents 没有正确触发?
我希望这个盒子在我看它时变成红色,在我看向别处时变成白色。但是,每当光标与立方体重叠时,我都会遇到这种奇怪的闪烁行为。这是代码...
当我使用js用aframe组件创建a-entity时,我得到了未定义
我正在尝试根据给定位置通过实体添加一些对象。问题是 setAttribute 不起作用,因为当我调用 getAttribute 时,它返回“未定义”。甚至几何...
A 框架和 HTML 编码新手 - 我的模型无法加载,我做错了什么?
。你好! 我只是尝试通过 A-frame 编码将我的 glb/gltf 模型加载到我的 Glitch 项目中,也遵循教程和网站自己的教程,但无济于事:( 这是一所大学
如何在 A-Frame 中进行 AR 命中测试(无标记)场景?我已经尝试了 6 或 7 个例子,但没有一个起作用。 我需要它在 iPhone 上运行,并且我正在使用 Variant Launch。他们有一个非常好的例子
我使用框架创建了一个具有 360 度背景的网站。因为我想在不同页面之间进行平滑过渡,所以我尝试在 Astro-Framework 中重写代码,但我有一些
我有一个 360 度图像,您必须环顾四周才能找到一个元素,然后在移动设备上用手指单击它。 是否可以使用 A 框架制作具有可点击兴趣的 360 度图像? ...
我正在努力定位一些aframe文本几何形状,并且想知道我是否以错误的方式处理这个问题😅 我发现当盒子渲染时,中心点处于最小值......
点击视频圈时我尝试做 4 件事: 播放单击的视频圈的视频纹理。 将单击的视频球的半径扩大到 4200。 使用类 &...
我在 A-Frame(版本 1.4.0)中面临着关于虚拟现实场景中相机碰撞的挑战。尽管采用了各种技术,例如使用碰撞属性,但集成了
我正在尝试使用 A-Frame 版本“1.5.0”加载 GLTF 模型,并通过网络摄像头在智能手机的浏览器中显示它。我在提供的代码中遇到了三个问题:首先,GLTF...
我正在尝试制作一个按钮,以便将其绑定到全景图中的特定位置。也就是说,当用户观看 360 度全景图时,按钮不应旋转。 我正在尝试制作一个按钮,以便将其绑定到全景图中的特定位置。也就是说,当用户查看 360 度全景图时,按钮不应旋转。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>panoramas</title> <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script> <style> #switchButton { cursor: pointer; } </style> </head> <body> <a-scene> <a-assets> <img id="panorama1" src="1.jpg"> <img id="panorama2" src="2.jpg"> </a-assets> <a-sky id="panorama" src="#panorama1" rotation="0 -130 0"></a-sky> <a-entity id="cameraRig"> <a-camera></a-camera> </a-entity> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#CCC" id="switchButton"></a-plane> </a-scene> <script> const button = document.querySelector('#switchButton'); let currentPanorama = 1; button.addEventListener('mouseenter', () => { const panorama = document.querySelector('#panorama'); if (currentPanorama === 1) { panorama.setAttribute('src', '#panorama2'); currentPanorama = 2; } else { panorama.setAttribute('src', '#panorama1'); currentPanorama = 1; } }); </script> </body> </html> 我正在尝试制作一个按钮,以便将其绑定到全景图中的特定位置。也就是说,当用户查看 360 度全景图时,按钮不应旋转。 我解决你的问题 您需要做的是添加一个光标来处理 onlcick 事件,这是唯一的方法。 <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width"> <title>A-Frame HTML Shader - Dynamic</title> <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script> <script src="https://unpkg.com/[email protected]/dist/aframe-html-shader.min.js"></script> <script> let currentPanorama = 1; AFRAME.registerComponent("click-log", { init: function () { this.myFunction = function () { const panorama = document.querySelector('#panorama'); if (currentPanorama === 1) { panorama.setAttribute('src', '#panorama2'); currentPanorama = 2; } else { panorama.setAttribute('src', '#panorama1'); currentPanorama = 1; } }; this.el.addEventListener("click", this.myFunction); }, remove: function () { this.el.removeEventListener("click", this.myFunction); } }); </script> </head> <body> <a-scene update-html> <a-camera> <a-cursor material="color: red"></a-cursor> </a-camera> <a-assets> <img id="panorama1" src="https://l13.alamy.com/360/PWNBM9/testing-new-cameralens-combination-in-my-garden-in-aarhus-denmark-PWNBM9.jpg"> <img id="panorama2" src="https://aframe.io/aframe/examples/boilerplate/panorama/puydesancy.jpg"> </a-assets> <a-sky id="panorama" src="#panorama1" rotation="0 -130 0"></a-sky> <a-entity id="cameraRig"> <a-camera></a-camera> </a-entity> <a-plane click-log position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#CCC" id="switchButton"></a-plane> </a-scene> </body> </html>
我似乎无法播放我的视频。起初,它只是一架黑色飞机,但我设法让它看到视频的第一帧,但它无法播放。我也在使用 MindAR...
如何镜像图像使其处于正确的方向? 我遵循@Piotr Adam Milewski 对于这个堆栈问题的解决方案:how-to-curve-a-plan-entity-to-match-a-sphere-surface。
我想通过模板组件动态改变文本,就像下面的代码通过event-set__click改变场景一样;我尝试放置第二个 event-set__click2 参数,但我无法...
我正在使用vue-cli。我尝试直接在 index.html 文件中添加 aframe,并将其导入到我的顶级 main.js 文件中。我只是无法让 Vue 识别 aframe 元素。 我是不是错过了一些
A-Frame / THREE.js,简化 gltf[glb] 模型上的修改器
此处找到三个简化修饰符的示例之一 https://github.com/mrdoob/ Three.js/blob/dev/examples/js/modifiers/SimplifyModifier.js 我知道它需要几何图形,并简化......