1.2.0 • Published 2 years ago

pl-bim-viewer v1.2.0

Weekly downloads
-
License
Apache License
Repository
github
Last release
2 years ago

wl-bim-viewer

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

2022-04-02:替换cdn资源失效地址;增加参数自定义模型的div容器id,避免同一个页面加载两次组件渲染错乱的问题;

传送门:Github & autodesk forge viewer文档

在线访问

快速上手

npm i wl-bim-viewer -S

import wlBimViewer from "wl-bim-viewer";`
import "wl-bim-viewer/lib/wl-bim-viewer.css"
Vue.use(wlBimViewer);
<wl-bim-viewer 
    multiple 
    :docs="bims" 
    class="wl-viewer">
</wl-bim-viewer>

重要更新

1.1.0 减少组件包体积,将js依赖cdn;请勿使用低于1.1.0版本 1.2.0 2022-04-02:替换cdn资源失效地址;增加参数自定义模型的div容器id,避免同一个页面加载两次组件渲染错乱的问题;

文档

Attributes

序号参数说明类型默认值
1docs模型数据数组,元素为对象且至少需要一个path字段(模型文件路径,可配置)Array-
2props配置项,详见下Object-
3multiple是否开启多模型顺序加载Booleanfalse
4changeClean是否开启当docs变化,清理之前的模型然后重新加载新模型Booleanfalse
5divID模型的div容器id,解决一个页面加载两次组件渲染错乱的问题Stringwl-viewer-box

props

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

Events

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

Form Methods

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

Slot

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

版本记录

1.2.0 减少组件包体积,将js依赖cdn

1.1.0 减少组件包体积,将js依赖cdn

1.0.0 因国外cdn时间波动太大,将js依赖本地化,并优化初始化事件防止init错误

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build