glodon-bimface-vue3

BIMFACE提供的开箱即用的VUE3组件，便于开发者快速将BIMFACE引入到VUE3项目中。

注意：此组件适用于Vue3版本的项目，如需在Vue2中使用，请安装glodon-bimface-vue

BIMFACE官网

使用方式

1. 在项目中安装glodon-bimface-vue3:

npm install glodon-bimface-vue3 --save

2. 在需要引入BIMFACE的VUE页面或组件中引入glodon-bimface-vue3:

import {BimfaceComponent, Glodon, onBimfaceModelLoaded} from 'glodon-bimface-vue3'

• BimfaceComponent是VUE组件，引入后可在模板中使用；

• Glodon是BIMFACE提供的各类接口的根级命名空间，可参考BIMFACE文档中心了解如何进行BIMFACE二次开发；

• onBimfaceModelLoaded用于注册模型加载完成事件，模型加载后，开发者可通过加载完成事件得到BIMFACE的app、viewer实例对象，进行二次开发；

3. 基本的使用方式参考：

<script setup>
import { BimfaceComponent, Glodon, onBimfaceModelLoaded } from 'glodon-bimface-vue3';
import { ref } from 'vue';

onBimfaceModelLoaded(({app, viewer}) => {
  console.log('Bimface Model Loaded', app, viewer);
})

const viewToken = ref('');

// getViewToken为异步获取模型viewToken的方法，由开发者基于后端API自行封装，此处仅为模拟异步接口返回viewToken值的示例
const getViewToken = () => new Promise((resolve) => setTimeout(() => resolve('68063517918c46269445b255fb429e3c'), 3000));

getViewToken().then((value) => viewToken.value = value);

</script>

<template>
  <BimfaceComponent style="height: 100vh;" :view-token="viewToken" />
</template>