customPolygon.js
1.32 KB
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
42
43
44
45
46
47
/*
* @Date: 2025-03-19 17:24:14
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-03-19 17:24:38
* @FilePath: /logic-flow2/src/views/node-model/customPolygon.js
* @Description: 文件描述
*/
import { PolygonNode, PolygonNodeModel } from '@logicflow/core';
class CustomPolygonModel extends PolygonNodeModel {
// 默认四边形 => 八边形
setAttributes() {
const width = 100;
const height = 100;
const x = 50;
const y = 50;
// 计算多边形的八个顶点, 中心点为[50, 50], 宽高均为100
const pointList = [
[x - 0.205 * width, y - 0.5 * height],
[x + 0.205 * width, y - 0.5 * height],
[x + 0.5 * width, y - 0.205 * height],
[x + 0.5 * width, y + 0.205 * height],
[x + 0.205 * width, y + 0.5 * height],
[x - 0.205 * width, y + 0.5 * height],
[x - 0.5 * width, y + 0.205 * height],
[x - 0.5 * width, y - 0.205 * height],
];
this.points = pointList;
}
getTextStyle() {
const { refX = 0, refY = 0 } = this.properties;
const style = super.getTextStyle();
// 通过 transform 重新设置 text 的位置:向下移动70px
return {
...style,
transform: `matrix(1 0 0 1 ${refX} ${refY + 70})`,
};
}
}
export default {
type: 'custom-polygon',
view: PolygonNode,
model: CustomPolygonModel,
};