gs-bim-air 0.0.3-0.1 → 0.0.3-0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/READMEBETA.md +8 -0
- package/demo//346/250/241/345/236/213/345/212/250/347/224/273//350/267/257/345/276/204/345/271/263/347/247/273/345/212/250/347/224/273.html +202 -0
- package/docs/classes/Viewer.md +27 -0
- package/docs//345/277/253/351/200/237/344/270/212/346/211/213.md +123 -0
- package/docs//347/256/200/344/273/213.md +39 -0
- package/lib/BimAir.common-report.html +2 -2
- package/lib/BimAir.common.js +125 -60
- package/lib/BimAir.css +103 -103
- package/lib/BimAir.umd-report.html +2 -2
- package/lib/BimAir.umd.js +125 -60
- package/lib/BimAir.umd.min-report.html +2 -2
- package/lib/BimAir.umd.min.js +125 -60
- package/package.json +1 -1
- package/public/js/longan/longan.js +10 -3
- package/public/js/longan/longan.wasm +0 -0
- package/public/js/longanWithoutShareArrayBuffer/longan.js +4 -2
- package/public/js/longanWithoutShareArrayBuffer/longan.wasm +0 -0
package/READMEBETA.md
ADDED
|
@@ -0,0 +1,202 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<meta charset="utf-8">
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
7
|
+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
8
|
+
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
|
9
|
+
<title>NWH-BIMCloud</title>
|
|
10
|
+
<link rel="stylesheet" href="https://static.graphicstone.com/bimAir/BimAir.css">
|
|
11
|
+
<script src="https://static.graphicstone.com/vue.min.js"></script>
|
|
12
|
+
<script src="https://static.graphicstone.com/bimAir/BimAir.umd.min.js"></script>
|
|
13
|
+
</head>
|
|
14
|
+
|
|
15
|
+
<body>
|
|
16
|
+
<style>
|
|
17
|
+
body {
|
|
18
|
+
margin: 0;
|
|
19
|
+
padding: 0;
|
|
20
|
+
height: 100vh;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
#app {
|
|
24
|
+
height: 100vh;
|
|
25
|
+
position: relative;
|
|
26
|
+
}
|
|
27
|
+
</style>
|
|
28
|
+
<div id="app">
|
|
29
|
+
<viewer-wrapper elementId="viewer" style="height: 100%; width: 100%" />
|
|
30
|
+
</div>
|
|
31
|
+
|
|
32
|
+
<script type="text/javascript">
|
|
33
|
+
new Vue({
|
|
34
|
+
el: '#app',
|
|
35
|
+
});
|
|
36
|
+
let options = {
|
|
37
|
+
// viewerType: "model",
|
|
38
|
+
elementId: "viewer",
|
|
39
|
+
modelService: "https://static.graphicstone.com/modelApi",
|
|
40
|
+
fileService: "https://static.graphicstone.com/fileApi",
|
|
41
|
+
background: "linear-gradient(#e3fcfc, #f6ffff)",
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
BimAir.Loader({ url: "https://static.graphicstone.com/bimAir" }).then(() => {
|
|
45
|
+
let viewer = new BimAir.Viewer(this.options);
|
|
46
|
+
viewer.isUpdateTt = true;
|
|
47
|
+
|
|
48
|
+
// 厂房Id
|
|
49
|
+
let modelId = "62b2f7aa3a591513fe1799b5";
|
|
50
|
+
// 肘管模型Id
|
|
51
|
+
let carObjId = "62b2f7a73a591513fe1799a9";
|
|
52
|
+
viewer
|
|
53
|
+
.loadModels([
|
|
54
|
+
{ id: modelId, version: 0 },
|
|
55
|
+
{ id: carObjId, version: 0 },
|
|
56
|
+
])
|
|
57
|
+
.then((lightModels) => {
|
|
58
|
+
console.log("roam Test");
|
|
59
|
+
this.modelName = viewer.renderObject.name;
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
// 动画移动的对象
|
|
63
|
+
let moveObjId = "QMD+M+4G+HYD+XDRA01+EL002";
|
|
64
|
+
let key = JS_Show_Key_By_Id(moveObjId);
|
|
65
|
+
let moveSegmentObject = new SegmentObject(viewer, key);
|
|
66
|
+
|
|
67
|
+
let bb = viewer.computeViewBoundingBox(moveSegmentObject.segment);
|
|
68
|
+
let center = new Float64Array([
|
|
69
|
+
(bb[0] + bb[3]) / 2,
|
|
70
|
+
(bb[1] + bb[4]) / 2,
|
|
71
|
+
(bb[2] + bb[5]) / 2,
|
|
72
|
+
])
|
|
73
|
+
|
|
74
|
+
let p0 = new BimAir.Longan.Point();
|
|
75
|
+
p0[0] = 380022.3124998525;
|
|
76
|
+
p0[1] = 39384.624999855165;
|
|
77
|
+
p0[2] = 3072.023193359375;
|
|
78
|
+
|
|
79
|
+
let p1 = new BimAir.Longan.Point();
|
|
80
|
+
p1[0] = center[0];
|
|
81
|
+
p1[1] = center[1];
|
|
82
|
+
p1[2] = center[2];
|
|
83
|
+
|
|
84
|
+
let p2 = new BimAir.Longan.Point();
|
|
85
|
+
p2[0] = 380022.3124998525;
|
|
86
|
+
p2[1] = 39484.624999855165;
|
|
87
|
+
p2[2] = 3072.023193359375;
|
|
88
|
+
|
|
89
|
+
let points = new Array();
|
|
90
|
+
points.push(p0);
|
|
91
|
+
points.push(p1);
|
|
92
|
+
points.push(p2);
|
|
93
|
+
|
|
94
|
+
// 绘制路径点线段(用来看的).
|
|
95
|
+
viewer.process.animationManager.drawStraight(points);
|
|
96
|
+
|
|
97
|
+
// 漫游时长
|
|
98
|
+
let roamTime = 10;
|
|
99
|
+
// 添加路径动画并返回动画事件的Id.
|
|
100
|
+
// 添加动画1
|
|
101
|
+
let animationId1 = viewer.process.animationManager.objectRoamWithoutRotate(moveSegmentObject, points, roamTime, PathType.Curve, () => {
|
|
102
|
+
console.log("finish1");
|
|
103
|
+
});
|
|
104
|
+
|
|
105
|
+
|
|
106
|
+
|
|
107
|
+
let animationId2 = "";
|
|
108
|
+
setTimeout(() => {
|
|
109
|
+
let moveObjId = "QMD+M+4G+HYD+XDRA01+EL001";
|
|
110
|
+
// 动画2移动的对象
|
|
111
|
+
let key = JS_Show_Key_By_Id(moveObjId);
|
|
112
|
+
let moveSegmentObject = new SegmentObject(viewer, key);
|
|
113
|
+
|
|
114
|
+
let bb = viewer.computeViewBoundingBox(moveSegmentObject.segment);
|
|
115
|
+
let center = new Float64Array([
|
|
116
|
+
(bb[0] + bb[3]) / 2,
|
|
117
|
+
(bb[1] + bb[4]) / 2,
|
|
118
|
+
(bb[2] + bb[5]) / 2,
|
|
119
|
+
])
|
|
120
|
+
|
|
121
|
+
let p0 = new BimAir.Longan.Point();
|
|
122
|
+
p0[0] = 380022.3124998525;
|
|
123
|
+
p0[1] = 39384.624999855165;
|
|
124
|
+
p0[2] = 3072.023193359375;
|
|
125
|
+
|
|
126
|
+
let p1 = new BimAir.Longan.Point();
|
|
127
|
+
p1[0] = center[0];
|
|
128
|
+
p1[1] = center[1];
|
|
129
|
+
p1[2] = center[2];
|
|
130
|
+
|
|
131
|
+
let p2 = new BimAir.Longan.Point();
|
|
132
|
+
p2[0] = 380022.3124998525;
|
|
133
|
+
p2[1] = 39484.624999855165;
|
|
134
|
+
p2[2] = 3072.023193359375;
|
|
135
|
+
|
|
136
|
+
let points = new Array();
|
|
137
|
+
points.push(p0);
|
|
138
|
+
points.push(p1);
|
|
139
|
+
points.push(p2);
|
|
140
|
+
|
|
141
|
+
// 添加动画2
|
|
142
|
+
animationId2 = viewer.process.animationManager.objectRoamWithoutRotate(moveSegmentObject, points, roamTime, PathType.Straight, () => {
|
|
143
|
+
console.log("finish2");
|
|
144
|
+
});
|
|
145
|
+
}, 5000);
|
|
146
|
+
|
|
147
|
+
// 在两秒后,播放全部动画,此时只有动画1
|
|
148
|
+
setTimeout(() => {
|
|
149
|
+
viewer.process.animationManager.run();
|
|
150
|
+
}, 2000);
|
|
151
|
+
|
|
152
|
+
// 8秒后,暂停动画1
|
|
153
|
+
setTimeout(() => {
|
|
154
|
+
let palyingPercent = viewer.process.animationManager.pauseAnime(animationId1);
|
|
155
|
+
console.log("playing:", palyingPercent);
|
|
156
|
+
}, 8000);
|
|
157
|
+
|
|
158
|
+
// 9秒后,重启动画1
|
|
159
|
+
setTimeout(() => {
|
|
160
|
+
viewer.process.animationManager.run([animationId1]);
|
|
161
|
+
}, 9000);
|
|
162
|
+
|
|
163
|
+
// 14秒后,复原所有物体位置
|
|
164
|
+
// 若物体的动画已结束,则复位.否则,不会.
|
|
165
|
+
// 此时动画1已结束,动画2未结束..因此动画1的物体会复位,而动画2不会.
|
|
166
|
+
setTimeout(() => {
|
|
167
|
+
viewer.process.animationManager.resetAnimationItems();
|
|
168
|
+
console.log("reset1");
|
|
169
|
+
}, 14000);
|
|
170
|
+
|
|
171
|
+
// 18秒后,复原所有物体位置.
|
|
172
|
+
// 此时动画1已结束,动画2已结束..因此都会复位
|
|
173
|
+
setTimeout(() => {
|
|
174
|
+
viewer.process.animationManager.resetAnimationItems();
|
|
175
|
+
console.log("reset2");
|
|
176
|
+
}, 18000);
|
|
177
|
+
|
|
178
|
+
// 19秒后,从头开始播放动画2
|
|
179
|
+
setTimeout(() => {
|
|
180
|
+
viewer.process.animationManager.restartAnime(animationId2);
|
|
181
|
+
}, 19000);
|
|
182
|
+
|
|
183
|
+
//20秒后,先删除动画1,再添加动画3
|
|
184
|
+
let animationId3 = "";
|
|
185
|
+
setTimeout(() => {
|
|
186
|
+
viewer.process.animationManager.removeAnime(animationId1);
|
|
187
|
+
animationId3 = viewer.process.animationManager.objectRoamWithoutRotate(moveSegmentObject, points, roamTime, PathType.Straight, () => {
|
|
188
|
+
console.log("finish3")
|
|
189
|
+
});
|
|
190
|
+
viewer.process.animationManager.run([animationId3]);
|
|
191
|
+
}, 20000);
|
|
192
|
+
|
|
193
|
+
// 25秒后,停止播放动画2,并将segmentObject复位.
|
|
194
|
+
setTimeout(() => {
|
|
195
|
+
viewer.process.animationManager.stopAnime(animationId2, true);
|
|
196
|
+
}, 25000);
|
|
197
|
+
});
|
|
198
|
+
});
|
|
199
|
+
</script>
|
|
200
|
+
</body>
|
|
201
|
+
|
|
202
|
+
</html>
|
package/docs/classes/Viewer.md
CHANGED
|
@@ -82,6 +82,7 @@
|
|
|
82
82
|
|
|
83
83
|
- [aspectRatio](Viewer.md#aspectratio)
|
|
84
84
|
- [backgroundColor](Viewer.md#backgroundcolor)
|
|
85
|
+
- [camera](Viewer.md#camera)
|
|
85
86
|
- [cameraOrientationFixed](Viewer.md#cameraorientationfixed)
|
|
86
87
|
- [dynamicMemory](Viewer.md#dynamicmemory)
|
|
87
88
|
- [freeze](Viewer.md#freeze)
|
|
@@ -852,6 +853,32 @@ Longan.Viewer.backgroundColor
|
|
|
852
853
|
|
|
853
854
|
___
|
|
854
855
|
|
|
856
|
+
### camera
|
|
857
|
+
|
|
858
|
+
• `get` **camera**(): `default`
|
|
859
|
+
|
|
860
|
+
获取Viewer相机信息
|
|
861
|
+
|
|
862
|
+
#### Returns
|
|
863
|
+
|
|
864
|
+
`default`
|
|
865
|
+
|
|
866
|
+
• `set` **camera**(`camera`): `void`
|
|
867
|
+
|
|
868
|
+
设置Viewer相机信息
|
|
869
|
+
|
|
870
|
+
#### Parameters
|
|
871
|
+
|
|
872
|
+
| Name | Type |
|
|
873
|
+
| :------ | :------ |
|
|
874
|
+
| `camera` | `default` |
|
|
875
|
+
|
|
876
|
+
#### Returns
|
|
877
|
+
|
|
878
|
+
`void`
|
|
879
|
+
|
|
880
|
+
___
|
|
881
|
+
|
|
855
882
|
### cameraOrientationFixed
|
|
856
883
|
|
|
857
884
|
• `get` **cameraOrientationFixed**(): `boolean`
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
# 快速上手
|
|
2
|
+
|
|
3
|
+
## 安装
|
|
4
|
+
|
|
5
|
+
### NPM
|
|
6
|
+
```
|
|
7
|
+
# 最新稳定版
|
|
8
|
+
$ npm install gs-bim-air
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
#### 添加静态资源
|
|
12
|
+
从gs-bim-air安装包里复的public文件夹复制js文件夹到Vue项目的静态资源目录（通常为public目录），复制后路径为：
|
|
13
|
+
|
|
14
|
+
> public\js\lzma\lzma.js
|
|
15
|
+
|
|
16
|
+
> public\js\longanWithoutShareArrayBuffer\longan.js
|
|
17
|
+
> public\js\longanWithoutShareArrayBuffer\longan.wasm
|
|
18
|
+
|
|
19
|
+
#### vue用法
|
|
20
|
+
```html
|
|
21
|
+
<template>
|
|
22
|
+
<div id="app">
|
|
23
|
+
<div id="viewerWrapper">
|
|
24
|
+
<viewer-wrapper elementId="viewer" ></viewer-wrapper>
|
|
25
|
+
</div>
|
|
26
|
+
</div>
|
|
27
|
+
</template>
|
|
28
|
+
<script>
|
|
29
|
+
import Vue from "vue";
|
|
30
|
+
import BimAir from 'gs-bim-air'
|
|
31
|
+
import 'gs-bim-air/lib/BimAir.css'
|
|
32
|
+
|
|
33
|
+
Vue.use(BimAir.ViewerWrapper);
|
|
34
|
+
|
|
35
|
+
export default {
|
|
36
|
+
name: "App",
|
|
37
|
+
components: {},
|
|
38
|
+
methods: {
|
|
39
|
+
},
|
|
40
|
+
|
|
41
|
+
mounted() {
|
|
42
|
+
let options = {
|
|
43
|
+
elementId: "viewer",
|
|
44
|
+
modelService: "https://static.graphicstone.com/modelApi",
|
|
45
|
+
fileService: "https://static.graphicstone.com/fileApi",
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
BimAir.Loader().then(() => {
|
|
49
|
+
let viewer = new BimAir.Viewer(options);
|
|
50
|
+
|
|
51
|
+
viewer.loadModels(["6253e9d6b0545a0a6e49bf85"]).then(() => {
|
|
52
|
+
viewer.fitWorld();
|
|
53
|
+
});
|
|
54
|
+
});
|
|
55
|
+
},
|
|
56
|
+
};
|
|
57
|
+
</script>
|
|
58
|
+
|
|
59
|
+
<style>
|
|
60
|
+
#app {
|
|
61
|
+
margin: 0;
|
|
62
|
+
padding: 0;
|
|
63
|
+
height: 100vh;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
#viewerWrapper {
|
|
67
|
+
height: 100vh;
|
|
68
|
+
}
|
|
69
|
+
</style>
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
### 直接用 <script> 引入
|
|
73
|
+
```html
|
|
74
|
+
<!DOCTYPE html>
|
|
75
|
+
<html>
|
|
76
|
+
<head>
|
|
77
|
+
<meta charset="UTF-8">
|
|
78
|
+
<title>引入BimAir</title>
|
|
79
|
+
<link rel="stylesheet" href="https://static.graphicstone.com/bimAir/BimAir.css">
|
|
80
|
+
<script src="https://static.graphicstone.com/vue.min.js"></script>
|
|
81
|
+
<script src="https://static.graphicstone.com/bimAir/BimAir.umd.min.js"></script>
|
|
82
|
+
</head>
|
|
83
|
+
|
|
84
|
+
<body>
|
|
85
|
+
<style>
|
|
86
|
+
body {
|
|
87
|
+
margin: 0;
|
|
88
|
+
padding: 0;
|
|
89
|
+
height: 100vh;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
#app {
|
|
93
|
+
height: 100vh;
|
|
94
|
+
position: relative;
|
|
95
|
+
}
|
|
96
|
+
</style>
|
|
97
|
+
<div id="app">
|
|
98
|
+
<viewer-wrapper elementId="viewer" style="height: 100%; width: 100%" />
|
|
99
|
+
</div>
|
|
100
|
+
|
|
101
|
+
<script type="text/javascript">
|
|
102
|
+
new Vue({
|
|
103
|
+
el: '#app',
|
|
104
|
+
});
|
|
105
|
+
|
|
106
|
+
let options = {
|
|
107
|
+
elementId: "viewer",
|
|
108
|
+
modelService: "https://static.graphicstone.com/modelApi",
|
|
109
|
+
fileService: "https://static.graphicstone.com/fileApi",
|
|
110
|
+
}
|
|
111
|
+
BimAir.Loader({ url: "https://static.graphicstone.com/bimAir" }).then(() => {
|
|
112
|
+
let viewer = new BimAir.Viewer(options)
|
|
113
|
+
let modelId = "624fff10aba44c07ef4b184e";
|
|
114
|
+
viewer.loadModels(["624fff10aba44c07ef4b184e"])
|
|
115
|
+
viewer.fitWorld();
|
|
116
|
+
})
|
|
117
|
+
</script>
|
|
118
|
+
</body>
|
|
119
|
+
</html>
|
|
120
|
+
```
|
|
121
|
+
|
|
122
|
+
|
|
123
|
+
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
# 轻量化云平台简介
|
|
2
|
+
轻量化云平台是基于云的BIM模型轻量化管理及应用平台，它由模型轻量化转换工具，基于WebGL的三维显示引擎和平台开发功能包组成。
|
|
3
|
+
|
|
4
|
+
## 平台架构
|
|
5
|
+
<center>
|
|
6
|
+
|
|
7
|
+
```mermaid
|
|
8
|
+
graph LR
|
|
9
|
+
subgraph 模型转换
|
|
10
|
+
n1("BIM模型(rvt、CATPart,dgn,IFC)") --> n2("模型轻量化引擎") --> n3("BIM轻量化模型(gsl)")
|
|
11
|
+
end
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
```
|
|
15
|
+
<font size=10>**↓**</font>
|
|
16
|
+
```mermaid
|
|
17
|
+
graph LR
|
|
18
|
+
subgraph 文件管理
|
|
19
|
+
n4("ModelCloud云服务平台")
|
|
20
|
+
|
|
21
|
+
end
|
|
22
|
+
```
|
|
23
|
+
<font size=10>↓</font>
|
|
24
|
+
```mermaid
|
|
25
|
+
graph LR
|
|
26
|
+
subgraph 模型绘制
|
|
27
|
+
n5("Longan绘制引擎(Web版，基于WebGL)")
|
|
28
|
+
end
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
</center>
|
|
32
|
+
|
|
33
|
+
## 开发环境。
|
|
34
|
+
轻量化云平台的API主要分两类：<br/>
|
|
35
|
+
1.基于前端开发的JS API，并提供Type Script声明文件以方便进行基于TS的开发。<br/>
|
|
36
|
+
2.基于服务器端的Web API。<br/>
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
|