问题标签 [react-three-fiber]

好吧，我有 .gltf 动画模型。我成功加载了模型，但无法播放嵌入的动画。我想知道是否可以通过任何方式解决它。顺便说一句，我正在对此做出反应。先感谢您。

在这里您可以找到模型 https://drive.google.com/file/d/1ZVyklaQuqKbSliu33hFxdyNpg4EQtcBH/view?usp=sharing

这是我尝试过的代码。

每当我尝试在我的 React 应用程序中运行此代码时，它都会失败并显示：

SyntaxError: 不能在模块外使用 import 语句

我正在尝试在重新渲染时保留非 usestate 变量的数据

我有一个主要组件，它有一个子组件。

子组件包含一个状态并返回一个Cube。它还包含useFrame()，对每一帧执行一个操作。

我使用它根据方向变量（每 3 秒改变一次方向）对立方体进行旋转。我还有另一个变量，时间由每帧上的增量递增。

问题是，当我单击Cube 时，子组件被重新渲染（正常），但我在此过程中丢失了时间和方向值，它们被重新初始化。

有没有办法不丢失数据？不重新初始化它们？我认为useEffect可以解决问题，但我不能将它放在useFrame（或useFrame中的useEffect）。也尝试了useMemo，但失败了，它没有保留更新的值，但我不太确定能很好地使用它吗？是否可以根据他自己的变化进行更新？

制作了一个codesandbox https://codesandbox.io/s/cube-rotation-sdfv8?file=/src/App.js:290-300

在这个例子中，我可以使用 setInterval，但这不是我的意思，这只是一个例子。我想使用useFrame来移动对象，例如，做一些“去那里，然后回来”。

使用 state/setState 也可以，但我会失去巨大的性能，因为它每秒完成 60 次。我可以有很多对象。

我在反应三纤维中不知所措。我想为相机创建一个装备（这在 three.js 中很简单）。我把相机放在一组里面。如果我想绕 Y 轴旋转相机，我改变父组的旋转。如果我想绕 X 轴旋转它，我会旋转相机本身。这样，我不处理万向节问题（例如，如果 y 旋转为 180 度，则 x 旋转反转）。

在three.js中我会做：

但在 react-three-fiber 我不知道。

我有一台我正在使用的相机，来自 useThree

我正在尝试为我的 ThreeJS 对象使用纹理。我收到错误：

地球.js：

index.js：

试图在我的项目中实现一个 cel 阴影模型。并在三个 js 文档中找到了这个例子

相同的源代码可在此处获得。但是，我对如何将导入的 OutlineEffect 应用到要返回的画布感到困惑。

为 Logo 对象实现了卡通着色器，

该示例使用 THREE.WebGlRenderer() 使用它来使用 OutlineEffect(renderer) 创建效果，然后使用该效果来渲染场景。

我的意思不是边界框和边界球，而是像素完美，我的意思是。

也许着色器或特殊渲染器？为不同的网格赋予不同的颜色，并通过渲染颜色检测选择了哪些对象？

经过三天的谷歌搜索，我在互联网上没有找到一个答案。请帮忙。

例如，不应选择此框：

搅拌机是如何做到的？如果我选择了很多对象，他清楚地了解我选择了什么。你对他们的算法有什么想法吗？

也许我们可以将场景中的物体绘制成不同的颜色，并渲染场景，然后使用像素颜色来了解哪些颜色是可见的？所以我们利用了显卡的并行特性？它就像光线投射，但通过每个选择像素。

我正在尝试在 React with Typescript 中加载带有 .gltf 扩展名的 3D 模型。3D 模型文件夹中的文件为 .gltf、.png 和 .bin 文件。用于此任务的工具是来自 drei 库的 webpack 和 useGLTFLoader。我尝试过不同的工具。主要来自三个.js 库，没有效果。错误显示未找到 3D 模型 404（如下所示），并且在应放置 3D 模型的位置没有出现任何内容。

我用于渲染 3D 模型的组件如下所示：

下面我分享我的 webpack 配置。

我的 webpack.config.js 文件位于项目的根目录中。assets 文件夹位于 src 文件夹中。最后，带有 React 代码的文件位于 src/components/ThreeDimensionComponent/ThreeDimensionComponent.tsx 中（因此它的路径是正确的）。

我正在尝试旋转四面体，使它们的一侧朝下，就像它们放置在地板上的物理对象一样。

我希望这个 SO 答案能解决我的问题

通过为四面体提供 applyMatrix 属性应用接受的答案后，我的代码如下所示：

然而，我的四面体的旋转并没有改变。我究竟做错了什么？

这是我当前的代码：小提琴

基本上我需要几十个（基本）网格同时在屏幕上移动，而且它们都必须始终知道它们的位置。我尝试过的方法在大约 10 个网格时会减慢速度，并且慢到 30 个网格时非常慢。在高层次上，我将如何处理？当然有可能，对吧？