问题标签 [react-three-fiber]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
251 浏览

timeline - ThreeJs - 在 ThreeJS 中构建时间轴组件

我正在尝试在 ThreeJS 中构建一个 Timeline 组件,类似于这个: https ://visjs.github.io/vis-timeline/examples/timeline/groups/groupsEditable.html

第一步是什么,我需要 ThreeJS 或其他 WebGL 库吗?

0 投票
1 回答
661 浏览

three.js - 如何在 React Three Fiber / ThreeJs 上交换元素

我有这个 Card 组件,单击它会激活并展开块。想点击一个,然后另一个他们切换位置。就像是:

并且不考虑在线相同的数字。行、列或主对角线。完成对块的排序,例如:

github 链接在这里:https ://github.com/iagokrt/board-game-threejs 我想出了一个愚蠢的董事会逻辑。

0 投票
2 回答
996 浏览

reactjs - react-three-fiber 在画布上显示多个蒙皮网格

嗨编码向导社区。这是我第一次使用 react-tree-fiber。我有我放在画布上的 3d 蒙皮模型。这里是沙盒。我想要实现的是能够根据某些事件(例如按下按钮等)在场景中放置多个角色。到目前为止,我找不到任何可以帮助我实现目标的东西。可能会有所帮助,但我无法将其合并到我的代码中。任何帮助将不胜感激!

0 投票
2 回答
2335 浏览

reactjs - 使用 react-three-fiber 在 gatsby 站点加载 gltf

我一直在尝试使用 react-three-fiber 将 GLTF 模型加载到我的 gatsby 站点中,但似乎无法加载它。这看起来应该很简单,但我是 Gatsby 和 Threejs 的新手,想知道是否可以得到一些指导。

我的模型存储为 static/models/crerar.glb,我使用 gltfjsx 生成了一个模型组件。我试过只引用'models/crerar.glb',但也没有运气。

在 index.js 中,我有:

在 Crerar.js 中(存储在组件中)

0 投票
1 回答
378 浏览

three.js - 通过动态更新 TubeBufferGeometry 的曲线创建光迹效果

我有一个使用 react-three-fiber 的第三人称游戏,我想在玩家移动的任何地方添加一种尾灯效果。光迹会在一段时间后消失,所以我想为这些点设置一个固定大小的数组。这是我最初尝试的解决方案:

基本上,我的思考过程是更新每一帧(或每 x 帧以提高性能)上的曲线,并使用索引来跟踪要更新的点数组中的哪个位置。

但是我遇到了两个问题:

  1. TubeBufferGeometry 不更新。不确定是否可以在实例化后更新几何。
  2. 我预见到使用这种固定数组/索引方法的缺陷是,一旦我到达数组的末尾,我将不得不绕回索引 0。所以曲线插值会搞砸,因为我假设它需要点依次。数组中的最后一个点现在应该连接到第一个点,但不会那样。

为了解决#2,我尝试了类似

而不是,points[index].copy(point);但我仍然无法让 Tube 首先更新。

我想看看是否有更好的解决方案,或者这是否是解决此类问题的正确方法。

0 投票
2 回答
2038 浏览

reactjs - react-three-fiber绕某个轴旋转

我正在使用react-three-fiber,我想以某个轴和角度旋转我的网格。我在哪里添加类似“setRotationfromAxisAngle”的反应三纤维

0 投票
1 回答
1118 浏览

javascript - 如何在网页中渲染 Blender 模型?

所以我探索了多种关于在我的网络应用程序中渲染我的搅拌机模型的选项,现在我正在将我的模型导出为一种.gltf格式,这是我的代码

应用程序.js

模型.js

问题

GLTF 加载程序抛出错误

我想要的是

  • 我想尽可能简单地渲染我的模型,因为它在反应应用程序的搅拌器中显示
  • 旋转控制会很棒..

抛出错误

0 投票
2 回答
737 浏览

reactjs - 如何在接触点上弹出问题或文本字段等文本

我目前正在使用 react-three-fiber 创建一个游戏,我想实现一个接触点,其中包含将由玩家回答的弹出问题或文本。已经完成了接触点,但我坚持创建一个与接触点相对应的弹出窗口。

0 投票
0 回答
67 浏览

three.js - 是否可以更改 meshNormalMaterial 默认 x、y、z 颜色?

我知道 meshNormalMaterial 将法线向量映射到 RGB 颜色。有没有办法覆盖默认颜色?我想将 x、y 和 z 更新为自定义的十六进制颜色值,而不是 x 为红色、y 为绿色和 z 为蓝色。这可能吗?

0 投票
0 回答
32 浏览

reactjs - 添加定时器功能后画布消失

在此处输入图像描述尝试使用带有计时器的 react-three-fiber 开发游戏。我试图创建基于反应功能的计时器。问题是,在将计时器包装到场景(游戏)之后,它覆盖了游戏并且只出现了计时器。