时间戳

首页 > 解决方案 > 在网格点击时，ArcRotateCamera 专注于

babylonjs - 在网格点击时，ArcRotateCamera 专注于

问题描述

我正在使用 ArcRotateCamera，当我点击网格时，我必须将相机对焦

var camera = new BABYLON.ArcRotateCamera("Camera", -Math.PI / 2, Math.PI / 2, 300, BABYLON.Vector3.Zero(), scene);
camera.setTarget(BABYLON.Vector3.Zero());



// on mesh click, focus in
var i = 2;
var pickInfo = scene.pick(scene.pointerX, scene.pointerY);
        if (pickInfo.hit) {
            pickInfo.pickedMesh.actionManager = new BABYLON.ActionManager(scene);
            pickInfo.pickedMesh.actionManager.registerAction(
                new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnPickTrigger,
                    function (event) {
                        camera.position = (new BABYLON.Vector3(pickInfo.pickedPoint.x, pickInfo.pickedPoint.y, camera.position.z + i));
                        i += 2;
                    })
            );
        }

此代码更改网格的 z 位置，但不使其位于屏幕中心

标签： babylonjs

解决方案

您的代码中可以更改一些内容。

1st - 您正在做的是在单击后执行代码操作，而不是在选择发生后简单地运行回调中的代码。您正在第一帧的右侧注册一个选择操作（技术上是用户单击），但前提是在正确的时刻在正确的位置找到了鼠标。我的猜测是它每次都不起作用（除非你的场景被网格覆盖:-)）

第二 - 你正在改变相机的位置，而不是改变它正在寻找的位置。更改相机的位置不会产生您想要的结果（查看选定的网格），它会将相机移动到新位置，同时仍专注于旧位置。

有几种方法可以解决这个问题。第一个是这样的：

scene.onPointerDown = function(evt, pickInfo) {
        if(pickInfo.hit) {
            camera.focusOn([pickInfo.pickedMesh], true);
        }
    }

ArcRotate 相机提供了 focusOn 功能，该功能聚焦在一组网格上，同时固定相机的方向。这很有帮助。你可以在这里看到一个演示：

https://playground.babylonjs.com/#A1210C#51

另一种解决方案是使用 setTarget 函数：

https://playground.babylonjs.com/#A1210C#52

这有点不同（注意相机的方向变化）。

另一件事 - 使用 Babylon 中集成的指针事件，因为它们为您节省了额外的场景选择调用。指针向下与函数中集成的pickinfo一起执行，因此您可以获得当前指针向下/向上/移动每一帧的拾取信息。

**** 编辑 ****

发表新评论后 - 由于您想要为值设置动画，您需要做的就是存储当前值，计算新值，并使用内部动画系统为值设置动画（此处的文档 - https://doc.babylonjs. com/babylon101/animations#basic-animation）。有很多方法可以实现这一点，我采用了一个旧功能并将其现代化:-)

这是演示 - https://playground.babylonjs.com/#A1210C#53

推荐阅读