cbim-render-viewcube/README.md

渲染引擎独立的ViewCube

# cbim-render-viewcube

这是一个配合 cbim-render-sdk 使用的插件，欢迎使用，如有不足，欢迎指正。
持续更新中...
* 注：支持所有的前端框架以及原生的引用方式

## install
安装方式：`npm install cbim-render-viewcube --save`
引用方式：`import ViewCube from 'cbim-render-viewcube'`

### 依赖的第三方库
ThreeJS的支持：`npm install three --save`

## npm安装方式使用说明

```javascript
    import ViewCube from 'cbim-render-viewcube'
    // 下面代码放在cbim-render-sdk返回的数据之后
    switch (data.type) {
        case 'LoadStatus':
            if (data.status === 'Finished') {
                // renderViewer 为 cbim-render-sdk 实例化之后的对象
                let viewCube = new ViewCube('容器ID', {
                    width: 120,
                    height: 120,
                    enableRotate: true,
                    styles: 'position: absolute; left: 10px; top: 10px;',
                    sendData: response => {
                        renderViewer.ws.sendData(response)
                    }
                })
            }
            break
    }
```

## script标签引入方式使用说明

```javascript
    // <script src="https://cdn.jsdelivr.net/npm/three@latest" type="text/javascript" charset="utf-8"></script>
    <script src="https://cdn.jsdelivr.net/npm/cbim-render-viewcube@latest" type="text/javascript" charset="utf-8"></script>
    // 下面代码放在cbim-render-sdk返回的数据之后
    switch (data.type) {
        case 'LoadStatus':
            if (data.status === 'Finished') {
                // renderViewer 为 cbim-render-sdk 实例化之后的对象
                let viewCube = new ViewCube('容器ID', {
                    width: 120,
                    height: 120,
                    styles: 'position: absolute; left: 10px; top: 10px;',
                    sendData: response => {
                        renderViewer.ws.sendData(response)
                    }
                })
            }
            break
    }
```

### ViewBox同步模型视角

```javascript
// 下面代码放在cbim-render-sdk返回的数据之后
    switch (data.type) {
        case 'viewQuat':
            viewCube && viewCube.coordinateAxesUpdateByQuat(JSON.parse(data.viewQuat))
            break
    }
```