---
order: 4
title: 帧缓冲拾取
type: 交互
label: Interact
---

在三维应用中时常需要拾取场景中的物体，[射线包围盒](docs/physics/query/raycast)是一种常用的方法，在 CPU 中进行拾取，**性能较好，但是精度较差**，因为包围盒比较简单，不能拾取复杂的模型。

当拾取频率不高时，可以考虑使用**像素级精度**的 `FramebufferPicker` 组件；当拾取频率过高时，需要开发者评估好性能开销是否适合业务场景，因为该组件底层会进行 CPU-GPU 通信，即调用 `gl.readPixels` 。

## 创建帧缓冲拾取

```typescript
import { FramebufferPicker } from "@galacean/engine-toolkit-framebuffer-picker";

const framebufferPicker = rootEntity.addComponent(FramebufferPicker);
framebufferPicker.camera = camera;
```

## 注册拾取事件

```typescript
class ClickScript extends Script {
  onUpdate(): void {
    const inputManager = this.engine.inputManager;
    if (inputManager.isPointerDown(PointerButton.Primary)) {
      const pointerPosition = inputManager.pointerPosition;
      framebufferPicker.pick(pointerPosition.x, pointerPosition.y).then((renderElement) => {
        if (renderElement) {
          // ...
        } else {
          // ...
        }
      });
    }
  }
}

cameraEntity.addComponent(ClickScript);
```