一個用於在瀏覽器上展現bim模型的vue插件

wl-bim-viewer

一個用於在瀏覽器上展現bim模型的vue插件，能夠預覽轉化後的BIM、CAD文件。
基於vue和autodesk forge viewer寫成。
目前支持單模型加載及多模型順序加載。
其餘特性正在擴展中。

傳送門：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版本

文檔

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區

版本記錄

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