# 门 Item 示例
# 源代码
查看源代码：/persagy-web-big/src/items/floor/SDoorItem.ts
# 代码说明
# 数据说明
Doors:[
{
FaceDirection: {X:0,Y:0,Z:0}, // 面朝方向
HandDirection: {X:0,Y:0,Z:0}, // 把手方向
Location: {X:0,Y:0,Z:0}, // 位置
ModelId: '', // 模型id
Name: '', // 名称
OutLine: [
[{X:0,Y:0,Z:0},...], // 外轮廓
... // 内轮廓
], // 轮廓线
Owner: '', // 拥有者的RevitId
SourceId: '', // 对应Revit模型id
Thick: 200, // 厚度
WallId: '', // 所属墙
Width: 200, // 宽度
},
...
]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
TIP
1、根据把手方向确定门的转轴
2、根据面朝方向确定门朝哪边开
3、 outline 仅有一项,且只有2个点
5、轮廓数据单位均为毫米
# 计算边界矩阵
不能在绘制的时候计算,因为绘制是高频调用方法,尽量不要在绘制方法中做大量计算工作;
计算方法一般在数据变化的时候做,如果只是展示的话,则只需要在构造函数中计算一次;
# 计算门开的方向及旋转方向
使用向量点乘 => x1 * x2 + y1 * y2，计算得到,大于0同向,则旋转点使用第二个点;否则使用第一个
计算两点间距离,从而得到门的长度
利用arctan计算得到,门展开方向与水平方向夹角
使用向量叉乘 => x1 * y2 - x2 * y1, 计算得到, 小于0代表门顺时针展开,同时确定了展开的弧线绘制起始和结束角度
# Y轴取反
revit 使用的坐标系与 canvas 使用的坐标系 Y 轴是相反的; revit 坐标使用的是数学坐标系, Y 轴方向是向上的, canvas 坐标使用的绘图坐标系, Y 轴方向是向下的;
数据是通过 revit 模型导出
# 绘制示例
查看代码
<template>
<div>
<canvas id="wall" width="800" height="400" tabindex="0" />
</div>
</template>
<script lang="ts">
import {SGraphScene, SGraphView} from "@persagy-web/graph/";
import {SDoorItem} from "@persagy-web/big/lib/items/floor/SDoorItem";
import { Component, Vue } from "vue-property-decorator";
@Component
export default class WallCanvas extends Vue {
view: SGraphView | undefined;
outline1 = [[{X:12000,Y:10000},{X:12000,Y:30000}]];
mounted(): void {
this.init();
};
init(): void {
this.view = new SGraphView('wall');
const scene = new SGraphScene();
this.view.scene = scene;
// 只模拟了轮廓数据
// @ts-ignore
const item = new SDoorItem(null,
// @ts-ignore
{
OutLine:this.outline1,
FaceDirection: {X: 0, Y: -1, Z: 0},
HandDirection: {X: 1, Y: 0, Z: 0}
}
);
scene.addItem(item);
this.view.fitSceneToView();
}
}
</script>
<style scoped>
</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41