three.jsLerping摄像头和动态taret一起观看（React三根光纤）

（我在stackOverflow上也问过同样的问题，但我发现这个网站&我认为它在这里可能更有意义。我希望这不会违反任何规则。原始帖子1-任何一个地方得到的答案都将被添加/链接到另一个地方。）
我正在尝试在单个随机放置对象的“缩小”和“放大”视图之间平稳过渡camera.positio
和camera.lookAt。
定位效果很好。然而，勒平lookAt()似乎并没有很好地与传统ThreeJS的其他解决方案配合使用（请参见@bovesa
的回答3），也没有在react three fiber文档（链接2）的相关示例中进行说明。
放大z轴后会翻转相机，你可以在这里看到我的进展：三光纤缩放到对象-代码Sandbox 23n，相关代码位于第63行的App.js
我花了数小时寻找相关的示例/教程，但还没有找到多少。不过，我恐怕没有足够的3JS经验来观察正确的方向，所以任何方向的帮助都是非常受欢迎的。在第2篇的文章中通过forerru
解决了这个问题。基本上你想要做的是和你在相机位置上做的一样，但是对于一个重影对象，你可以调整重影对象的位置做摄影机，看(ghostObject.位置.x，ghostObject.位置.y，ghostObject.位置（z）如果有帮助？
基本上，您希望执行与相机位置相同的操作，但对于重影对象，您可以删除重影对象的位置并执行以下操作摄影机，看(ghostObject.位置.x，ghostObject.位置.y，ghostObject.位置（z）如果有帮助？
我建议在需要设置相机动画时使用Yomutsu的相机控件。它是OrbitControls的改进版本，具有转换相机的功能。GitHubGitHub-yomotsu/相机控制：用于three.js，类似于。。。25three.js，与三、轨道控制但支持平滑过渡和更多功能。-GitHub-yomotsu/摄影机控件：用于three.js，类似于三个…
您可能想使用setLookAt将动画设置到一个新位置：ncontrols.setLookAt( positionX, positionY, positionZ, targetX, targetY, targetZ, true)
谢谢@forerrun！这很管用。我很难弄清楚如何创建一个透明材质（三纤维缩放到对象-幻影解决方案-CodeSandbox 4），但我相信这最终会是一个简单得多的问题。再次感谢。@looeee这件看起来非常整洁，但我恐怕没有三根纤维的排骨。不过，谢谢你的推荐。这肯定会在未来的项目中发挥作用。
在r3f中使用任何第三方都没有什么大不了的：yomotsu摄像头控制-CodeSandbox 11。这完全是一样的，你只会将其分类为副作用和渲染循环更新。您可以选择扩展jsx并“呈现”控件，或者如果需要，也可以在UseMoom中强制创建它。nfunction Controls() = => ref.current.update(delta))return drcmda:ncreate it imperatively in a useMemo if you want.nFor the record, that would work like this:nfunction Controls() =>>nThanks @drcmda for the confirmation, and @looeee for the implementation!Please forgive the newbishness here, but I\"m placing the 在中使用与相同的方法，并且遇到了Cannot read property \"handlers\" of undefined错误。我假设更改相机位置的请求应该在useFrame内，对吗？（目前正在使用原始沙盒的一个分支：Line 77@three fiber zoom to object-摄像头控制解决方案-CodeSandbox 6）
感谢您的帮助！
所以…我在ghost解决方案中也遇到了一个奇怪的错误，这让我非常困惑：只有在我热修复代码之后，它才能完美工作。在初始加载时，lookatAt不起作用，但是如果我在代码中添加了一些东西——不管它是什么——它工作得很好。我恐怕不知道三者是如何联系在一起的，不知道在哪里寻找答案。任何方向的轻推都将不胜感激-谢谢！（这个问题的演示：三光纤缩放到对象-重影解决方案-代码沙盒6）
你不能这样做：n*function Foo() {function Bar() { ... }return }
我的意思是你可以，但这没有意义，*Bar在*Foo每次渲染时都是一个新组件，所以它每次都会挂载/卸载并释放数据。你甚至有钩子在里面，它们都是徒劳的。这通常会导致奇怪的错误和比赛条件。经验法则：永远不要在功能范围内定义组件。
以下是固定版本：三光纤对象缩放-摄像头控制解决方案（分叉）-代码Sandbox 7nps。如果没有正确使用实例化网格，则不能直接转储3.网眼布物体进入3.InstancedMesh. 这就是它的工作原理：实例-代码沙盒5n@drcmdaAh-ha！好的，你的观点是：嵌套很有意义。（几年前我就应该意识到的事情）关于实例，我花了很多时间在这些例子上（我的这个小演示最初是基于实例顶点颜色-CodeSandbox 2），但最终只得到了最粗略的概念，即在下面到底发生了什么引擎盖。很明显，我遗漏了一些重要的东西，我将做更多的研究。
也感谢改进后的示例！这更有意义。现在***14***似乎起作用了，但***15***已经完全不可靠了——今天晚些时候我会坐在那里，看看我是否能弄清楚到底发生了什么。
我确实拿出了一些关于我不知道它是干什么的职位的代码。对于实例化网格，使用起来有点困难，但一旦你理解了setMatrixAt的内容，你就会习惯它。
对于以后遇到这种情况的人，你可以在这里找到一个工作示例：
解决方案：三光纤缩放到对象-相机控制解决方案-最终-代码沙盒49
这只是@drcmda的一个细微变化“s实施***16***与正常lerping移动照相机，它这并不完美（例如，相机控件中的过渡时间似乎不可编辑，所以当你缩小时会发生奇怪的摆动），但它确实解决了问题。（非常感谢@looeea
和@forerru
提供的额外帮助。）
Lerping camera and lookAt together with dynamic taret (React three fiber)n

three.jsLerping摄像头和动态taret一起观看（React三根光纤）

three.js[已解决]正交摄影机的变换控件：gizmos缩放问题

three.js多次渲染同一模型（obj模型），FPS要低得多

three.js可缩放场景背景

three.js移动导入的Gltf模型

three.js平面明暗处理的问题

three.js如何渲染立方体材质？

three.js如何创建要在网格中拟合的线段

three.jsGLTFLoader.js这是我的登记簿错误

three.js使用threejs的光流

three.js使用光线投射动态绘制多边形