# @adatechnology/game-interactables-three 中文文档

规范地址：https://npmcn.com/package/%40adatechnology/game-interactables-three/

版本：0\.2\.4
npm 元数据更新时间：2026-11-06T05:12:13.854Z
中文译文更新时间：2026-11-06T11:38:21.884Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40adatechnology/game-interactables-three
原文对照：https://npmcn.com/package/%40adatechnology/game-interactables-three/?lang=original
项目主页：https://github.com/Andersonfrfilho/adatechnology-game-kit#readme
源码仓库：https://github.com/Andersonfrfilho/adatechnology-game-kit

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：1.2 MB，8 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：6 个
- peer 依赖：three ^0\.160\.0
- 首次发布：2026-10-23T15:06:39.070Z
- 最新版本发布：2026-11-06T05:12:13.493Z
- 近 30 天下载量：3366（2026-10-05 至 2026-11-03，npm 官方下载统计）
- 已发布版本数：22（近 12 个月 22 个）

## 中文简介

3.js 适配器,用于 @adatechnology/game-interactables:由动画部件并列成材质的网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网.

## 安装

```sh
npm install @adatechnology/game-interactables-three
```

也可以使用：`pnpm add @adatechnology/game-interactables-three`、`yarn add @adatechnology/game-interactables-three`、`bun add @adatechnology/game-interactables-three`

## README

# @ adatechnology/ game- 交互 三

3.js 适配器用于 [`@adatechnology/game-interactables`](https://npmcn.com/package/%40adatechnology/game-interactables) 内容包,通过 `HouseholdApi` (单位:千美元) `PropsApi` 联 合 国 [`@adatechnology/game-props3d`](https://npmcn.com/package/%40adatechnology/game-props3d) 加号 `part(id, pivot, ry, draw)`) (中文(简体) ).

它把一个内容包的原始部分变成几个合并的元件, 移动世界动画的部分, 并绘制效果,屏幕, 镜相相相相相相相相相相相相相相相相相相相相相相相相相相相相. `three` 是导入的对等依赖 **仅作为类型**: 主机通过自己的 `THREE` (和 `Reflector`(中文(简体) ) 里面,所以从来没有第二个副本 三在捆绑。 无资产,无其他运行时间依赖关系.

## 安装

```sh
pnpm add @adatechnology/game-interactables-three three
```

没有捆绑的浏览器( 全局为 `GameInteractablesThree`:

```html
<script src="https://unpkg.com/@adatechnology/game-interactables-three/dist/index.global.js"></script>
<script>
  const adapter = GameInteractablesThree.createThreeAdapter(THREE, { document })
</script>
```

## 使用量

```ts
import * as THREE from 'three'
import { Reflector } from 'three/examples/jsm/objects/Reflector.js'
import { createThreeAdapter } from '@adatechnology/game-interactables-three'

const gfx = createThreeAdapter(THREE, { document, Reflector, envMap })

// 1. build an object: every primitive is merged into one geometry per material, every part into its own group
const { api, finish } = gfx.createMeshApi({ quality: 'game' })
pack.build('wardrobe', {}, api) // your content pack draws through api.box / cylinder / leaf / plane / light / part
const { group, parts } = finish() // parts: { door: Group, drawer_1: Group, ... }
scene.add(group)

// 2. each frame
world.update(dt)
gfx.syncObject(world, 'wardrobe-1', parts, { time: clock.elapsedTime })
effects.update(dt, world.emitters())
mirrors.update(camera, world.mirrors([x, y, z], 6))
```

每个功能也都不受约束 并带走 `THREE` 第一条: `createMeshApi(THREE, options)`, (中文(简体) ), `applyPose(THREE, group, motion, t)`,, , , , , , , , .

### 网点

`createMeshApi(THREE, { materials, quality, shadows })` 返回时 `{ api, finish, materials }`。建造者引入一个 [`game-shapes`](https://npmcn.com/package/%40adatechnology/game-shapes) 计划( s)`createShapeRecorder` 游戏道具3d)和 `finish` 把它烤起来 `generate`; 字节为 移动前用自己的模板制作的此 api(`tests/exact-golden.test.ts`页:1.

-   执行 `box`, (中文(简体) ), `cylinder` (形状) `cyl`, (中文(简体) ), `cyl6`, (中文(简体) ), `cone`, (中文(简体) ), `sphere`, (中文(简体) ), `leaf`, (中文(简体) ), `plane` (附地图集) `uv`, (中文(简体) ), `light` 财务报告和审定财务报表 `part`。 。 。 .
-   静态原始人被烤入 **一个 `BufferGeometry` 每件材料**:静态正体的绘图调用是数字 使用中的材料(`plain`, (中文(简体) ), `metal`, (中文(简体) ), `wood`, (中文(简体) ), `glass`, (中文(简体) ), `fabric`, (中文(简体) ), `plant`, (中文(简体) ), `water`, (中文(简体) ), `emissive`, (中文(简体) ), `atlas_picture`, (中文(简体) ), `atlas_floor`) (中文(简体) ).
-   `part(id, pivot, ry, draw)` {\\fn黑体\\fs22\\bord1\\shad0\\3ahbe\\4ah00\\fscx67\\fscy66\\2chffffff\\3ch808080}所有牵引到里面的东西 `draw` 组成一个自己的小组, 合并的每个材料。 组的起源是 转动它 `ry`,因此在部分框中表示一个轴或滑动轴。 名称是 `part:<id>` 财务报告和审定财务报表 `userData.part = id` 组合 **财务报告和审定财务报表** 它的蛋白质,所以 `raycaster.intersectObject(group, true)[0].object.userData.part` 给了被击中的部分.
-   `M.x`, (中文(简体) ), `M.z`, (中文(简体) ), `M.ry` (b) 部分内部绘制的坐标是相对于其支点.
-   `materials` 映射您材料的密钥; 缺少密钥的默认值 `vertexColors` (单位:千美元)`MeshStandardMaterial` 页:1 `quality: 'high'`, (中文(简体) ), `MeshLambertMaterial` 页:1 `'game'`,它也使用更少的片段). Atlas材料由你提供(a) `CanvasTexture` 内容提要.
-   `api.light` 创建一个 `PointLight` 在正确的组内; `finish()` ưμ㼯a `lights`。 。 。 .
-   **绘制调用 `game` 质量.** `plain`, (中文(简体) ), `metal`, (中文(简体) ), `wood` 财务报告和审定财务报表 `fabric` 是一个共享的兰伯特材料, 所以它们合并成一个网格每 目标. `finish(spec)` (通过包返回的光谱;选项) `mergeParts`默认值 `game` 质量)还合并了其中的一部分 `PartSpec.group` 与一个运动(盲丝:顶点阴影中一个倒接点,一套制服,阴影接踵而来)和 `cloth` 软相卷(一行上衣:一网相接,一倒相接的布指数和锚地,每块布能自活起. `parts[id]` 接下来 合并组的分数( e)`userData.merged`和 `syncObject` 驱动它。 带有镜像的部件,一个转动的部分(`ry`或孤军奋战. 在家庭包上测量:将38个网眼盲为3个,衣线31至2个.
-   **材料钩.** `materialFor(key, partId)` (通过 `createMeshApi`,或 `finish(spec, { materialFor })` 返回材料 每个网格`partId` 实值 `null` 例如,一个带每个房间的光罩。 将克隆物组合并 批量阴影器,但 **保留** 联合国 `onBeforeCompile`, (中文(简体) ), `customProgramCacheKey`, (中文(简体) ), `defines` 财务报告和审定财务报表 `userData` (批发补丁运行在你之后),所以 被合并的盲线或衣线被蒙上面具并像其他一切一样被点燃;具有不同材料的网格从不被混入一个被合并的网格.
-   `createScreen` 请求一个 `willReadFrequently` 2D上下文(画布每次重排都会被重新加载;这避免了浏览器的回读警告).

### 行为和同步

`applyPose(THREE, group, motion, t)` 构成其 `Motion` (hinge / 摇摆 / knob 旋转, 幻灯片翻译, 比例尺沿 页:1 其余的姿势被记住在 `group.userData.rest`,所以叫它每个帧 从来没有漂移. `syncObject(THREE, world, objectId, parts, { time })` 应用来自世界的每个部分的t和每个软音量的起伏(组在 `soft.part ?? soft.id`) (中文(简体) ).

### 衣服会摇摆 投出正确的阴影

```ts
const handle = gfx.attachSway(clothMesh, { amplitude: 0.04 })
```

`swayMaterial(THREE, base, { amplitude, anchorY })` 复制材料并补齐顶点阴影器( 统一) `time`, (中文(简体) ), `ax`, (中文(简体) ), `az`, (中文(简体) ), `anchorY`)于是顶点从锚线上悬起并摇摆. 这个 **同一补丁** 进入 `customDepthMaterial` (方向和点数) 阴影)和 `customDistanceMaterial` (点光影),所以影跟随动画而不是闪烁. `attachSway` 全部设置 三个在网状上; `syncObject` 驾驶它的制服从 `world.sway(...)`。 。 。 .

### 效果

```ts
// `scene` (where the particle objects go) and `camera` (its fov sizes the point sprites) are required options.
// `camera` may also be a function returning the current camera, or `null` for a 90 degree lens.
const effects = gfx.createEffects({ scene, camera, maxParticles: 800, document })
effects.update(dt, world.emitters()) // reads the camera it was created with; `effects.setCamera(other)` swaps it
effects.setViewHeight(renderer.domElement.height) // on resize
```

烟花和蒸汽(烟花,柔软,起伏和生长),火花(添加,黄色至红色),火花和水. 一个 `Points` 各种固定缓冲器, 互换后移, 每帧没有分配; 活体总数从未超过 `maxParticles` (按种类划分). 宝石被画在画布上 `document`,或作为数据纹理生成。 种子相生,故同相种子相生出同相花. Sprite 大小使用相机 垂直 `fov` (和 `zoom`),每页阅读 `update` (或 `setCamera(camera)`);没有相机,假设有90度镜头.

-   **水费** (强度为0.25和上)是一个带带丝的半透明流网,沿引力弧向下滚动 倒数`floorY` 选项)或改为 `emitter.reach` 水深一米(水龙头倒入水盆),四周有喷水滴和一滴水 带着一点小雾,它降落的地方。 薄发者(tap)相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相相去相去相去相去相去相去相去相去相去相相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相去相相 每条流一个绘图调用 (单位:千美元)`maxStreams`,默认值 6。 低强度滴入.
-   **天然气 `flame`** 是一个小蓝圆锥的环 每燃烧器(所有环都共享一个网,一个抽取呼叫, `maxFlames`)加上柔软的发光.
-   他们住在这里 `effects.meshes` (单位:千美元)`group`, (中文(简体) ), `streams`, (中文(简体) ), `flames`) (中文(简体) ).

### 屏幕

```ts
const tv = gfx.createScreen({ w: 128, h: 72 })
tvMesh.material = tv.material
tv.setOn(true); tv.setChannel(2); tv.update(dt)
```

Canvas纹理: 关闭时为黑色而不会发光; 打开时, 0 频道为彩色条, 1 静态噪音, 2 为动画地貌( 更高) 数字用倒数来重复.

### 镜像

```ts
const mirrors = gfx.createMirrors({ max: 1, resolution: 512 })
mirrors.register('wardrobe-1:mirror', mirrorMesh) // world id objectId:mirrorId
mirrors.update(camera, world.mirrors(eye, 6)) // returns the ids that got a real reflector
```

注册的 meshes 显示一个嵌入图材料。 离这里最近的 `max` 面对相机 得到集合 `Reflector`在飞机前放入一毫米 与网格的旋转和大小。 没有 `Reflector` 所有东西都留在地窖地图上.

**`renderer.info` 和反省者.** 三个 `Reflector` 让现场再次在主场内 `render()`; 被嵌入的会使重生 `renderer.info` (当 `info.autoReset` 开始吧,所以 `info.render.calls` 只能数反射手的传球. `createMirrors({ keepInfo })` (默认) `true`)将反射器包住,从而将主通关的计数器添加回并 `info.render.calls` 编号 : `triangles` 覆盖整个 边框。 设定主机 `renderer.info.autoReset = false` 并重置它自己 独自一人.

### 坐标

`createCord(THREE, points, radius, material)` 建立一个管; `catenary(a, b, sag, n)` 返回时 `n` 悬索的分数,其最低值 点是 `sag` 和弦下方为米.

## 页:1

-   `poseOf` 将可交互包的外观数学(同为默认值)转换为正弦,因此渲染的部分总是与引擎相匹配.
-   一切都是决定性的:效果和屏幕噪声使用种子发电机.

## 销毁

`finish(spec)` 将 spec 的破坏标记复制到三个对象,这样一个破坏主机就可以找到每个网格的由: `userData.destructionMaterial` (SDK 材质 id)在静态的 meshes(对象默认)上,在每一部分组及其 meshes上,在部分组及其 meshes上, `userData.destructionPart` (该部分编号,作为 `@adatechnology/game-destruction-three` 期望, `userData.destructionPiece` 财务报告和审定财务报表 `userData.destructionJoint`. 部件合并成一个共享组(blind slats),带有第一部分的标记. 损害本身是由 `@adatechnology/game-destruction`; 此软件包仅包含标签 。 没有光谱,没有标记.

## 葡萄牙

适应者三.js para o `@adatechnology/game-interactables`. Recebe as primitivas dos packes de conteúdo (第1行)`box`, (中文(简体) ), `cylinder`, (中文(简体) ), `leaf`, (中文(简体) ), `plane`, (中文(简体) ), `light` 电子 `part`e 作为军政府 **美洲地美特丽亚·波克材料**, com cada parte móvel (porta, gerta, tampa) em um grupo próprio com 相机 相机 相机 相机 相机 相机 折纸没有活口。 欧 `THREE` (原始内容存档于2013-10-12). semprepre passado pelo jogo (o pacote só pigna tipos).

```ts
const gfx = createThreeAdapter(THREE, { document, Reflector, envMap })
const { api, finish } = gfx.createMeshApi({ quality: 'game' })
pack.build('guarda_roupa', {}, api)
const { group, parts } = finish()
scene.add(group)
// a cada quadro
gfx.syncObject(world, 'guarda-roupa-1', parts, { time: clock.elapsedTime })
```

坦贝姆电车 `swayMaterial` 编号 : `attachSway` (balanço de roupa no 顶点遮阳剂, 共产材料, profundidade e de distância iguais, 第a段) (fumaça、雾、蒸气、água、faíscas)、telas comcanais animados、espelhos com) `Reflector` 保护马伊斯 e cabos (英语:`createCord`, (中文(简体) ), `catenary`) (中文(简体) ).

## 常见问题

### @adatechnology/game-interactables-three 是什么？

3\.js 适配器,用于 @adatechnology/game-interactables:由动画部件并列成材质的网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网状网\.

### 如何安装 @adatechnology/game-interactables-three？

在项目目录运行 npm install @adatechnology/game-interactables-three，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：three（^0\.160\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @adatechnology/game-interactables-three 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @adatechnology/game-interactables-three 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @adatechnology/game-interactables-three 可以商用吗？

@adatechnology/game-interactables-three 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @adatechnology/game-interactables-three 的下载量有多少？

根据 npm 官方下载统计，@adatechnology/game-interactables-three 在 2026/10/05 – 2026/11/03 这 30 天内被下载 3,366 次，日均约 112 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @adatechnology/game-interactables-three 还在维护吗？

最新版本 0\.2\.4 发布于 2026/11/06（今天）；至今共发布 22 个版本，其中过去 12 个月发布了 22 个；首次发布于 2026/10/23。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。