# xdx-forthree

> 本项目由夏翔率领的BIM-GIS组齐力构建，封装了平时可能用到的three方面的功能，便于不会使用three的人快速构建项目

Latest version **1.0.2** (published 2021-05-28) · 0 weekly downloads

## Install

```sh
npm install xdx-forthree
pnpm add xdx-forthree
yarn add xdx-forthree
bun add xdx-forthree
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2021-05-28 |
| First published | 2021-05-27 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 52 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | 夏翔，刘振宇，袁思琳，胡欣立 |
| Maintainers | abelliumr |

## Links

- npm: https://www.npmjs.com/package/xdx-forthree
- npm.io page: https://npm.io/package/xdx-forthree

## Dependencies (2)

- [three](https://npm.io/package/three.md) ^0.127.0
- [@tweenjs/tween.js](https://npm.io/package/@tweenjs/tween.js.md) ^18.6.4

## Recent versions

- 1.0.2 (latest) — 2021-05-28
- 1.0.1 — 2021-05-27
- 1.0.0 — 2021-05-27
- 0.1.2 — 2021-05-27
- 0.1.1 — 2021-05-27
- 0.1.0 — 2021-05-27

## README

# XDX ( 西电X )

> 提供统一 API , 供其他组使用

需要下载两个包, @tweenjs/tween.js 以及 three

- npm install  @tweenjs/tween.js
- npm install  three
- 用 yarn 也行



## 初始化

> 初始化语句尽量放在 mounted 中



### 初始化最简单语句

```javascript
const dom = document.querySelector('#canvas')
// dom 元素为 canvas 对象
const xdx = new XDX.APP({
    canvas: dom
})
```



### 需要相机自由移动

`xdx.addCameraControl()`



### 添加灯光效果

```javascript
// 默认添加的为环境光
// type 默认值为 1, color 默认值为 0x999999, intensity 为 0.5
xdx.addLight()

// 有返回值, 返回值是 灯的对象

// 非默认的光
// 参数介绍, 
// type: 1 是环境光, 任何地方都有这个光; 2 是点光, 就像家里的圆形灯
// color: 是光发出的颜色
// intensity: 光的强度, 0-1, 建议全部光源加一起等于 1
xdx.addLight({type: 1, color: 0x888888, intensity: 0.5})


```



### 添加模型

##### 添加远程对象
```JavaScript
 // 返回的是 promise 对象, then 中获取模型对象
 let promise = xdx.addModel('/model/dog.FBX')
 let dogModel;
 promise.then(model => {
     xdx.scene.add(model)
     model.scale.set(0.4, 0.4, 0.4)
     model.position.set(0, -40, 0)
     dogModel = model;
	 // 注册模型点击事件
     xdx.addModelEvent(model, 'click')
     // 添加模型后可以对模型进行一些操作, 比如 model.position.set(x, x, x);
 })
```
  
##### 添加已有对象
```JavaScript
// 添加线型灯
addMesh('lineLight')
```

---
_Source: https://npm.io/package/xdx-forthree · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
