Pit-bimwin-ui NPM

pit-bimwin-ui

无需使用专业设计软件，用户可以在 Web 浏览器端、移动客户端中查看、操作图纸模型。基于轻量化引擎可以开发更加丰富、更有价值的 BIM 应用。

安装

npm 安装

推荐使用 npm 的方式安装，它能更好地和 webpack 打包工具配合使用。

npm i pit-bimwim-ui

快速上手

完整引入

在 main.js 中写入以下内容

import Vue from "vue";
import PitBimWinUi from "pit-bimwin-ui";
import "pit-bimwin-ui/lib/PIT.css";
Vue.use(PitBimWinUi);

pit-bim-win-ui 组件

加载一个模型及相关的配置

<template>
  <pit-bim-win-ui
    ref="pitBimWinUi"
    :options="options"
    :headers="headers"></pit-bim-win-ui>
</template>

<script>
export default {
  data() {
    return {
      options: {
        fileId: ["93d0f57ccc0140c99835e0af35850e90"],
        url: "http://172.18.1.72:9983/",
      },
      headers: {
        token: "0e8d286ecfa84f01a97c7733b8aeb4a2dt3xrlvrghl",
        loginMark: "6Iqx6Ze05LiA5aO26YWS77yM54us6YWM5peg55u45Lqy",
      },
    };
  },
};
</script>

属性

参数名	类型	描述	参数
options	object	具体请看 options 下表	-
headers	object	具体请看 headers 下表	-
visibleToolbar	array	需要隐藏的底部功能按钮	-

options 属性字段说明

参数名	类型	描述	参数
url	string	主机地址	-
fileId	string	模型 id

headers 属性字段说明

参数名	类型	描述	参数
token	string	-	-
loginMark	string	-	-

visibleToolbar id 说明

id	描述	分组	图标/图片
mainPerspective	主视角	group1	icon
currentMainPerspective	设置当前为主视图	group1	img
resetMainPerspective	重置主视图	group1	img
directoryTree	目录树	group1	icon
fullScreen	全屏	group1	img
measurement	测量	group2	icon
section	剖切	group2	img
axialSection	轴向剖切	group2	img
roamingMode	漫游模式	group2	img
componentDetails	构件属性	group2	img
layer	图层	group2	icon
annotation	批注	group2	img
label	标签	group2	img
setUp	设置	group3	icon
minimap	小地图	group3	img
basicInformation	基本信息	group3	icon