wl-cad-viewer

一个用于在浏览器上展示bim模型的vue插件，可以预览转化后的CAD文件。
基于vue和autodesk forge viewer写成。
目前支持单模型加载及多模型顺序加载。
其他特性正在扩展中。

在线访问

快速上手

npm i wl-cad-viewer -S

import wlCadViewer from "wl-cad-viewer";`
Vue.use(wlCadViewer);

<wl-viewer 
    multiple 
    :docs="bims" 
    class="wl-viewer">
</wl-viewer>

文档

Attributes

| 序号 | 参数 | 说明 | 类型 | 默认值 | | ---- | ---- | ---- | ---- | ---- | | 1 | docs | 模型数据数组，元素为对象且至少需要一个path字段（模型文件路径，可配置） | Array | - | | 2 | props | 配置项,详见下 | Object | - | | 3 | multiple | 是否开启多模型顺序加载 | Boolean | false |

props

| 序号 | 参数 | 说明 | 默认字段 | 字段值类型 | | ---- | ---- | ---- | ---- | ---- | | 1 | path | 用于配置docs参数内的模型文件路径字段，必填 | path | String | | 2 | options | 用于loadModel时的自定义模型配置项，可配置模型角度、位置等。此字段应是一个对象 | options | Object | | 3 | name | 用于docs参数内模型的名称字段，选填 | name | String |

Events

| 序号 | 事件名称 | 说明 | 回调参数 | | ---- | ---- | ---- | ---- | | 1 | init | viewer初始化事件，此时模型还未加载，可进行配置或注册事件操作 | function(viewer) 依次为当前viewer对象 | | 2 | partSelect | 构件点击事件 | function(selections, event, info) 以此为当前选择构件、当前点击对象、构件信息 | | 3 | cameraMove | 摄像头移动事件 | function(rvt) 依次为当前rvt对象 | | 4 | successAll | 多模型时，全部加载完毕事件 | function(result) 依次为全部模型对象数组 | | 5 | errorAll | 多模型时，全部加载失败事件 | function(result) 依次为失败信息 | | 6 | success | 模型加载成功回调 | function(result) 依次为当前模型信息 | | 7 | loaded | 模型渲染完毕回调 | function(evt) 依次为当前模型信息 | | 8 | error | 模型加载失败回调 | function(name, code) 依次为当前模型docs参数name字段、错误码 |

Form Methods

| 序号 | 方法名 | 说明 | 参数 | | ---- | ---- | ---- | ---- | | 1 | clearColor | 清空模型构件上色 | - | | 2 | viewerFiting | 聚焦摄像头 | function(ids, focal) 依次为需要聚焦至的构件id、焦距 | | 3 | unloadModel | 卸载model模型 | function(model) 依次为需要卸载的模型model，无则默认为当前model | | 4 | uploadViewer | 卸载viewer | - | | 5 | getModelInfo | 获取模型信息 | function(viewer, models) 依次为viewer对象、已加载的model对象 |

Slot

| 序号 | name | 说明 | | ---- | ---- | ---- | | 1 | - | 位于模型dom下的自定义dom区 |

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build