@logicflow/extension 2.0.0-beta.5 → 2.0.0-beta.6
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/.turbo/turbo-build.log +871 -20
- package/dist/index.css +63 -0
- package/dist/index.min.js +18 -2
- package/es/NodeResize/control/Control.js +3 -2
- package/es/NodeResize/control/Control.js.map +1 -1
- package/es/components/mini-map/index.js +2 -2
- package/es/components/mini-map/index.js.map +1 -1
- package/es/components/selection-select/index.js.map +1 -1
- package/es/index.css +63 -0
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -0
- package/es/index.js.map +1 -1
- package/es/materials/group/GroupNode.d.ts +6 -6
- package/es/materials/group/GroupNode.js +7 -6
- package/es/materials/group/GroupNode.js.map +1 -1
- package/es/materials/group/index.js +20 -25
- package/es/materials/group/index.js.map +1 -1
- package/es/style/index.css +63 -0
- package/es/style/index.less +73 -0
- package/es/style/raw.d.ts +1 -1
- package/es/style/raw.js +1 -1
- package/es/style/raw.js.map +1 -1
- package/es/tools/flow-path/index.js +0 -1
- package/es/tools/flow-path/index.js.map +1 -1
- package/es/tools/label/Label.d.ts +30 -0
- package/es/tools/label/Label.js +241 -0
- package/es/tools/label/Label.js.map +1 -0
- package/es/tools/label/LabelModel.d.ts +26 -0
- package/es/tools/label/LabelModel.js +86 -0
- package/es/tools/label/LabelModel.js.map +1 -0
- package/es/tools/label/LabelOverlay.d.ts +28 -0
- package/es/tools/label/LabelOverlay.js +161 -0
- package/es/tools/label/LabelOverlay.js.map +1 -0
- package/es/tools/label/algorithm.d.ts +16 -0
- package/es/tools/label/algorithm.js +27 -0
- package/es/tools/label/algorithm.js.map +1 -0
- package/es/tools/label/index.d.ts +59 -0
- package/es/tools/label/index.js +292 -0
- package/es/tools/label/index.js.map +1 -0
- package/es/tools/label/mediumEditor.d.ts +16 -0
- package/es/tools/label/mediumEditor.js +91 -0
- package/es/tools/label/mediumEditor.js.map +1 -0
- package/es/tools/label/utils.d.ts +64 -0
- package/es/tools/label/utils.js +336 -0
- package/es/tools/label/utils.js.map +1 -0
- package/es/tools/snapshot/index.js +0 -2
- package/es/tools/snapshot/index.js.map +1 -1
- package/lib/NodeResize/control/Control.js +3 -2
- package/lib/NodeResize/control/Control.js.map +1 -1
- package/lib/components/mini-map/index.js +2 -2
- package/lib/components/mini-map/index.js.map +1 -1
- package/lib/components/selection-select/index.js.map +1 -1
- package/lib/index.css +63 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib/materials/group/GroupNode.d.ts +6 -6
- package/lib/materials/group/GroupNode.js +7 -6
- package/lib/materials/group/GroupNode.js.map +1 -1
- package/lib/materials/group/index.js +19 -24
- package/lib/materials/group/index.js.map +1 -1
- package/lib/style/index.css +63 -0
- package/lib/style/index.less +73 -0
- package/lib/style/raw.d.ts +1 -1
- package/lib/style/raw.js +1 -1
- package/lib/style/raw.js.map +1 -1
- package/lib/tools/flow-path/index.js +0 -1
- package/lib/tools/flow-path/index.js.map +1 -1
- package/lib/tools/label/Label.d.ts +30 -0
- package/lib/tools/label/Label.js +247 -0
- package/lib/tools/label/Label.js.map +1 -0
- package/lib/tools/label/LabelModel.d.ts +26 -0
- package/lib/tools/label/LabelModel.js +89 -0
- package/lib/tools/label/LabelModel.js.map +1 -0
- package/lib/tools/label/LabelOverlay.d.ts +28 -0
- package/lib/tools/label/LabelOverlay.js +167 -0
- package/lib/tools/label/LabelOverlay.js.map +1 -0
- package/lib/tools/label/algorithm.d.ts +16 -0
- package/lib/tools/label/algorithm.js +32 -0
- package/lib/tools/label/algorithm.js.map +1 -0
- package/lib/tools/label/index.d.ts +59 -0
- package/lib/tools/label/index.js +298 -0
- package/lib/tools/label/index.js.map +1 -0
- package/lib/tools/label/mediumEditor.d.ts +16 -0
- package/lib/tools/label/mediumEditor.js +97 -0
- package/lib/tools/label/mediumEditor.js.map +1 -0
- package/lib/tools/label/utils.d.ts +64 -0
- package/lib/tools/label/utils.js +349 -0
- package/lib/tools/label/utils.js.map +1 -0
- package/lib/tools/snapshot/index.js +0 -2
- package/lib/tools/snapshot/index.js.map +1 -1
- package/package.json +9 -7
- package/src/NodeResize/control/Control.tsx +3 -2
- package/src/components/mini-map/index.ts +2 -2
- package/src/components/selection-select/index.ts +5 -1
- package/src/index.ts +1 -0
- package/src/materials/group/GroupNode.ts +11 -8
- package/src/materials/group/index.ts +33 -38
- package/src/style/index.less +73 -0
- package/src/style/raw.ts +64 -1
- package/src/tools/flow-path/index.ts +0 -1
- package/src/tools/label/Label.tsx +297 -0
- package/src/tools/label/LabelModel.ts +82 -0
- package/src/tools/label/LabelOverlay.tsx +159 -0
- package/src/tools/label/algorithm.ts +42 -0
- package/src/tools/label/index.ts +401 -0
- package/src/tools/label/mediumEditor.ts +93 -0
- package/src/tools/label/utils.ts +395 -0
- package/src/tools/snapshot/README.md +27 -16
- package/src/tools/snapshot/index.ts +0 -2
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import LogicFlow, { TextMode } from '@logicflow/core';
|
|
2
|
+
import Position = LogicFlow.Position;
|
|
3
|
+
import Extension = LogicFlow.Extension;
|
|
4
|
+
export type ILabelOptions = {
|
|
5
|
+
isMultiple?: boolean;
|
|
6
|
+
maxCount?: number;
|
|
7
|
+
labelWidth?: number;
|
|
8
|
+
textOverflowMode?: 'ellipsis' | 'wrap' | 'clip' | 'nowrap' | 'default';
|
|
9
|
+
};
|
|
10
|
+
export declare class Label implements Extension {
|
|
11
|
+
static pluginName: string;
|
|
12
|
+
lf: LogicFlow;
|
|
13
|
+
options: ILabelOptions;
|
|
14
|
+
textOverflowMode: 'ellipsis' | 'wrap' | 'clip' | 'nowrap' | 'default';
|
|
15
|
+
isMultiple: boolean;
|
|
16
|
+
labelWidth?: number;
|
|
17
|
+
maxCount: number;
|
|
18
|
+
labelInitPositionMap: Map<string, Position>;
|
|
19
|
+
constructor({ lf, options }: {
|
|
20
|
+
lf: LogicFlow;
|
|
21
|
+
options: ILabelOptions;
|
|
22
|
+
});
|
|
23
|
+
/**
|
|
24
|
+
* 格式化元素的 Label 配置,后续初始化 Label 用统一的数据格式
|
|
25
|
+
* 主要是将 _label 类型 string | LabelConfig | LabelConfig[] 统一转换为 LabelConfig[]
|
|
26
|
+
* @param graphModel 当前图的 model
|
|
27
|
+
* @param element 当前元素 model
|
|
28
|
+
* @return LabelConfig[]
|
|
29
|
+
*/
|
|
30
|
+
private formatConfig;
|
|
31
|
+
/**
|
|
32
|
+
* 根据初始化的数据,格式化 Label 的数据格式后,统一更新到元素的 properties._label 中,保证后续的渲染以这个数据格式进行
|
|
33
|
+
* @param graphModel
|
|
34
|
+
*/
|
|
35
|
+
private setupLabels;
|
|
36
|
+
/**
|
|
37
|
+
* 给元素添加一个 label
|
|
38
|
+
* @param element
|
|
39
|
+
* @param position
|
|
40
|
+
*/
|
|
41
|
+
private addLabel;
|
|
42
|
+
/**
|
|
43
|
+
* 移除元素的某个 label
|
|
44
|
+
* @private
|
|
45
|
+
*/
|
|
46
|
+
private addEventListeners;
|
|
47
|
+
/**
|
|
48
|
+
* 重写元素的一些方法,以支持 Label 的拖拽、编辑等
|
|
49
|
+
* @param element
|
|
50
|
+
*/
|
|
51
|
+
private rewriteInnerMethods;
|
|
52
|
+
/**
|
|
53
|
+
* 更新当前渲染使用的 Text or Label 模式
|
|
54
|
+
*/
|
|
55
|
+
updateTextMode(textMode: TextMode): void;
|
|
56
|
+
render(): void;
|
|
57
|
+
destroy(): void;
|
|
58
|
+
}
|
|
59
|
+
export default Label;
|
|
@@ -0,0 +1,292 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { createUuid, TextMode } from '@logicflow/core';
|
|
13
|
+
import { cloneDeep, forEach, isArray, isObject, map } from 'lodash-es';
|
|
14
|
+
import LabelOverlay from './LabelOverlay';
|
|
15
|
+
import { calcPointAfterResize, rotatePointAroundCenter, } from './utils';
|
|
16
|
+
var Label = /** @class */ (function () {
|
|
17
|
+
function Label(_a) {
|
|
18
|
+
var lf = _a.lf, options = _a.options;
|
|
19
|
+
var _b, _c, _d;
|
|
20
|
+
this.labelInitPositionMap = new Map();
|
|
21
|
+
this.lf = lf;
|
|
22
|
+
// DONE: 根据 options 初始化一些插件配置,比如是否支持多个 label 等,生效在所有 label 中
|
|
23
|
+
this.options = options !== null && options !== void 0 ? options : {};
|
|
24
|
+
this.textOverflowMode = (_b = options.textOverflowMode) !== null && _b !== void 0 ? _b : 'default';
|
|
25
|
+
this.isMultiple = (_c = options.isMultiple) !== null && _c !== void 0 ? _c : true;
|
|
26
|
+
this.labelWidth = options.labelWidth;
|
|
27
|
+
this.maxCount = (_d = options.maxCount) !== null && _d !== void 0 ? _d : Infinity;
|
|
28
|
+
// DONE: 1. 启用插件时,将当前画布的 textMode 更新为 TextMode.LABEL。
|
|
29
|
+
// 如果将其又重新设置为 TextModel.TEXT,则需要 disable 掉 Label 工具,enable TextEditTool
|
|
30
|
+
lf.graphModel.editConfigModel.updateTextMode(TextMode.LABEL);
|
|
31
|
+
// TODO: 2. 做一些插件需要的事件监听
|
|
32
|
+
this.addEventListeners();
|
|
33
|
+
// TODO: 3. 自定义快捷键,比如 delete,选中 label 时,移除 label
|
|
34
|
+
// this.rewriteShortcut()
|
|
35
|
+
// 插件中注册 LabelOverlay 工具,用于 label 的编辑
|
|
36
|
+
lf.tool.registerTool(LabelOverlay.toolName, LabelOverlay);
|
|
37
|
+
// LabelOverlay 和 TextEditTool 互斥,所以将它 disable 掉
|
|
38
|
+
lf.tool.disableTool('text-edit-tool');
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* 格式化元素的 Label 配置,后续初始化 Label 用统一的数据格式
|
|
42
|
+
* 主要是将 _label 类型 string | LabelConfig | LabelConfig[] 统一转换为 LabelConfig[]
|
|
43
|
+
* @param graphModel 当前图的 model
|
|
44
|
+
* @param element 当前元素 model
|
|
45
|
+
* @return LabelConfig[]
|
|
46
|
+
*/
|
|
47
|
+
Label.prototype.formatConfig = function (graphModel, element) {
|
|
48
|
+
var _a = graphModel.editConfigModel, nodeTextEdit = _a.nodeTextEdit, edgeTextEdit = _a.edgeTextEdit, nodeTextDraggable = _a.nodeTextDraggable, edgeTextDraggable = _a.edgeTextDraggable;
|
|
49
|
+
var _b = this, textOverflowMode = _b.textOverflowMode, isMultiple = _b.isMultiple, maxCount = _b.maxCount, labelWidth = _b.labelWidth;
|
|
50
|
+
var text = element.text, zIndex = element.zIndex, _c = element.properties, _label = _c._label, _d = _c._labelOption, _labelOption = _d === void 0 ? {} : _d;
|
|
51
|
+
// 当前元素的 Label 相关配置
|
|
52
|
+
var curLabelConfig = _label;
|
|
53
|
+
var _e = _labelOption, curIsMultiple = _e.isMultiple, curMaxCount = _e.maxCount;
|
|
54
|
+
// REMIND: 对 3 种可能得数据类型进行处理
|
|
55
|
+
var formatConfig = []; // 保存格式化后的 LabelConfig
|
|
56
|
+
if (isArray(curLabelConfig)) {
|
|
57
|
+
// 1. 数组的话就是 LabelConfig[] 类型
|
|
58
|
+
// 判断是否开启 isMultiple, 如果开启了,判断是否超过最大数量。超出就截取
|
|
59
|
+
var size = curMaxCount !== null && curMaxCount !== void 0 ? curMaxCount : maxCount; // 优先级,当设置 multiple 时,元素的 maxCount 优先级高于插件的 maxCount
|
|
60
|
+
if (isMultiple && curIsMultiple) {
|
|
61
|
+
if (curLabelConfig.length > size) {
|
|
62
|
+
formatConfig = curLabelConfig.slice(0, size);
|
|
63
|
+
}
|
|
64
|
+
else {
|
|
65
|
+
formatConfig = curLabelConfig;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
else {
|
|
69
|
+
formatConfig = [curLabelConfig[0]];
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
else if (isObject(curLabelConfig)) {
|
|
73
|
+
// 2. 对象的话就是 LabelConfig 类型
|
|
74
|
+
formatConfig = [curLabelConfig];
|
|
75
|
+
}
|
|
76
|
+
else if (typeof curLabelConfig === 'string' || !curLabelConfig) {
|
|
77
|
+
// 3. 字符串或者为空的话就是 string 类型,基于 text 的数据合成 LabelConfig 信息(主要复用 text 的 x,y 信息)
|
|
78
|
+
var config = __assign(__assign({}, text), { content: curLabelConfig || text.value, draggable: element.BaseType === 'edge' ? edgeTextDraggable : nodeTextDraggable });
|
|
79
|
+
formatConfig = config.value ? [config] : [];
|
|
80
|
+
}
|
|
81
|
+
// TODO: 针对 Edge,在 edge 更新时 重新计算 Label 的位置
|
|
82
|
+
if (element.BaseType === 'edge') {
|
|
83
|
+
// 判断当前 label,是否在 edge 的路径上,如果不在,就重新计算位置
|
|
84
|
+
formatConfig = map(formatConfig, function (config) {
|
|
85
|
+
var x = config.x, y = config.y;
|
|
86
|
+
console.log('x, y --->>>', x, y);
|
|
87
|
+
return config;
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
// DONE: 再根据一些全局配置,比如是否支持垂直显示等,对 LabelConfig 进行二次处理
|
|
91
|
+
// 优先级:全局配置 > 元素配置。比如全局设置 isMultiple 为 true 时,才可以使用 局部的 isMultiple 设置才生效
|
|
92
|
+
// 当全局 isMultiple 为 false 时,局部的 isMultiple 不生效
|
|
93
|
+
return map(formatConfig, function (config) {
|
|
94
|
+
if (!config.id) {
|
|
95
|
+
config.id = createUuid();
|
|
96
|
+
}
|
|
97
|
+
var value = config.value, content = config.content, vertical = config.vertical, editable = config.editable, draggable = config.draggable, labelTextOverflowMode = config.textOverflowMode;
|
|
98
|
+
var textEdit = element.BaseType === 'node' ? nodeTextEdit : edgeTextEdit;
|
|
99
|
+
var textDraggable = element.BaseType === 'node' ? nodeTextDraggable : edgeTextDraggable;
|
|
100
|
+
return __assign(__assign({}, config), { zIndex: zIndex, labelWidth: labelWidth, content: content !== null && content !== void 0 ? content : value, vertical: vertical !== null && vertical !== void 0 ? vertical : false, editable: textEdit && editable, draggable: textDraggable && draggable, textOverflowMode: labelTextOverflowMode !== null && labelTextOverflowMode !== void 0 ? labelTextOverflowMode : textOverflowMode });
|
|
101
|
+
});
|
|
102
|
+
};
|
|
103
|
+
/**
|
|
104
|
+
* 根据初始化的数据,格式化 Label 的数据格式后,统一更新到元素的 properties._label 中,保证后续的渲染以这个数据格式进行
|
|
105
|
+
* @param graphModel
|
|
106
|
+
*/
|
|
107
|
+
Label.prototype.setupLabels = function (graphModel) {
|
|
108
|
+
var _this = this;
|
|
109
|
+
// const elements = [...graphModel.nodes, ...graphModel.edges]
|
|
110
|
+
var elements = graphModel.sortElements;
|
|
111
|
+
// TODO: 1. 筛选出当前画布上,textMode 为 TextMode.LABEL 的元素(在支持元素级别的 textMode 时,需要做这个筛选)
|
|
112
|
+
// REMIND: 本期先只支持全局配置,所以判断全局的 textMode 即可
|
|
113
|
+
forEach(elements, function (element) {
|
|
114
|
+
// DONE: 2. 在此处做数据的转换
|
|
115
|
+
// 输入:NodeConfig.properties._label: string | LabelConfig | LabelConfig[]
|
|
116
|
+
// 输出:NodeData.properties._label: LabelData | LabelData[]
|
|
117
|
+
// 是否需要根据 isMultiple 控制是否返回数组或对象 or 直接全部返回数组 ❓❓❓ -> 目前直接全部返回数组
|
|
118
|
+
_this.rewriteInnerMethods(element);
|
|
119
|
+
var formatLabelConfig = _this.formatConfig(graphModel, element);
|
|
120
|
+
// FIX: BUG Here: 格式化后的 labelConfig 没有同步到 element 上,导致每次重新渲染时,都会重新格式化,且重新生成 id
|
|
121
|
+
// 但如果在此处通过 setProperty 更新元素的 _label 时,又会导致死循环
|
|
122
|
+
element.setProperty('_label', formatLabelConfig);
|
|
123
|
+
});
|
|
124
|
+
};
|
|
125
|
+
/**
|
|
126
|
+
* 给元素添加一个 label
|
|
127
|
+
* @param element
|
|
128
|
+
* @param position
|
|
129
|
+
*/
|
|
130
|
+
Label.prototype.addLabel = function (element, position) {
|
|
131
|
+
var _a, _b, _c;
|
|
132
|
+
var maxCount = this.maxCount;
|
|
133
|
+
var _d = element.properties, _label = _d._label, _labelOption = _d._labelOption;
|
|
134
|
+
var curLabelConfig = (_a = _label) !== null && _a !== void 0 ? _a : [];
|
|
135
|
+
var curLabelOption = (_b = _labelOption) !== null && _b !== void 0 ? _b : {};
|
|
136
|
+
var len = curLabelConfig.length;
|
|
137
|
+
var newLabel = {
|
|
138
|
+
id: createUuid(),
|
|
139
|
+
x: position.x,
|
|
140
|
+
y: position.y,
|
|
141
|
+
content: "Label".concat(len + 1),
|
|
142
|
+
value: "Label".concat(len + 1),
|
|
143
|
+
style: {},
|
|
144
|
+
draggable: true,
|
|
145
|
+
editable: true,
|
|
146
|
+
vertical: false,
|
|
147
|
+
};
|
|
148
|
+
if (len >= ((_c = curLabelOption === null || curLabelOption === void 0 ? void 0 : curLabelOption.maxCount) !== null && _c !== void 0 ? _c : maxCount)) {
|
|
149
|
+
return;
|
|
150
|
+
}
|
|
151
|
+
curLabelConfig.push(newLabel);
|
|
152
|
+
element.setProperty('_label', curLabelConfig);
|
|
153
|
+
};
|
|
154
|
+
/**
|
|
155
|
+
* 移除元素的某个 label
|
|
156
|
+
* @private
|
|
157
|
+
*/
|
|
158
|
+
// private removeLabel() {}
|
|
159
|
+
Label.prototype.addEventListeners = function () {
|
|
160
|
+
var _this = this;
|
|
161
|
+
var graphModel = this.lf.graphModel;
|
|
162
|
+
var eventCenter = graphModel.eventCenter, editConfigModel = graphModel.editConfigModel;
|
|
163
|
+
eventCenter.on('graph:rendered', function (_a) {
|
|
164
|
+
var graphModel = _a.graphModel;
|
|
165
|
+
_this.setupLabels(graphModel);
|
|
166
|
+
});
|
|
167
|
+
// 监听元素双击事件,给元素增加 Label
|
|
168
|
+
eventCenter.on('node:dbclick,edge:dbclick', function (_a) {
|
|
169
|
+
var e = _a.e, data = _a.data;
|
|
170
|
+
// DONE: 增加 label 的数据信息到 element model
|
|
171
|
+
var target = graphModel.getElement(data.id);
|
|
172
|
+
// DONE: 将 clientX 和 clientY 转换为画布坐标
|
|
173
|
+
var _b = graphModel.getPointByClient({
|
|
174
|
+
x: e.clientX,
|
|
175
|
+
y: e.clientY,
|
|
176
|
+
}).canvasOverlayPosition, x1 = _b.x, y1 = _b.y;
|
|
177
|
+
var point = {
|
|
178
|
+
x: x1,
|
|
179
|
+
y: y1,
|
|
180
|
+
};
|
|
181
|
+
if (target && editConfigModel.textMode === TextMode.LABEL) {
|
|
182
|
+
_this.addLabel(target, point);
|
|
183
|
+
}
|
|
184
|
+
});
|
|
185
|
+
// 监听 node:resize 事件,在 resize 时,重新计算 label 的位置信息
|
|
186
|
+
eventCenter.on('node:resize', function (_a) {
|
|
187
|
+
var _b, _c;
|
|
188
|
+
var preData = _a.preData, data = _a.data, model = _a.model;
|
|
189
|
+
var _d = (_b = preData.properties) !== null && _b !== void 0 ? _b : {}, preWidth = _d.width, preHeight = _d.height, _e = _d._label, _label = _e === void 0 ? [] : _e;
|
|
190
|
+
var _f = (_c = data.properties) !== null && _c !== void 0 ? _c : {}, curWidth = _f.width, curHeight = _f.height;
|
|
191
|
+
if (preWidth && preHeight && curWidth && curHeight) {
|
|
192
|
+
var origin_1 = {
|
|
193
|
+
x: preData.x,
|
|
194
|
+
y: preData.y,
|
|
195
|
+
width: preWidth,
|
|
196
|
+
height: preHeight,
|
|
197
|
+
};
|
|
198
|
+
var scaled_1 = {
|
|
199
|
+
x: data.x,
|
|
200
|
+
y: data.y,
|
|
201
|
+
width: curWidth,
|
|
202
|
+
height: curHeight,
|
|
203
|
+
};
|
|
204
|
+
var newLabelConfig = map(_label, function (label) {
|
|
205
|
+
var x = label.x, y = label.y;
|
|
206
|
+
var newPoint = calcPointAfterResize(origin_1, scaled_1, { x: x, y: y });
|
|
207
|
+
return __assign(__assign({}, label), newPoint);
|
|
208
|
+
});
|
|
209
|
+
model.setProperty('_label', newLabelConfig);
|
|
210
|
+
}
|
|
211
|
+
});
|
|
212
|
+
// 监听 node:rotate 事件,在 rotate 时,重新计算 Label 的位置信息
|
|
213
|
+
eventCenter.on('node:rotate', function (_a) {
|
|
214
|
+
var model = _a.model;
|
|
215
|
+
var x = model.x, y = model.y, rotate = model.rotate, _b = model.properties._label, _label = _b === void 0 ? [] : _b;
|
|
216
|
+
var center = { x: x, y: y };
|
|
217
|
+
var newLabelConfig = map(_label, function (label) {
|
|
218
|
+
if (!label.id)
|
|
219
|
+
return label;
|
|
220
|
+
var point = { x: label.x, y: label.y };
|
|
221
|
+
if (_this.labelInitPositionMap.has(label.id)) {
|
|
222
|
+
point = _this.labelInitPositionMap.get(label.id);
|
|
223
|
+
}
|
|
224
|
+
else {
|
|
225
|
+
_this.labelInitPositionMap.set(label.id, point);
|
|
226
|
+
}
|
|
227
|
+
// 弧度转角度
|
|
228
|
+
var theta = rotate * (180 / Math.PI);
|
|
229
|
+
if (theta < 0)
|
|
230
|
+
theta += 360;
|
|
231
|
+
var radian = theta * (Math.PI / 180);
|
|
232
|
+
var newPoint = rotatePointAroundCenter(point, center, radian);
|
|
233
|
+
return __assign(__assign(__assign({}, label), newPoint), { rotate: theta });
|
|
234
|
+
});
|
|
235
|
+
model.setProperty('_label', newLabelConfig);
|
|
236
|
+
});
|
|
237
|
+
};
|
|
238
|
+
/**
|
|
239
|
+
* 重写元素的一些方法,以支持 Label 的拖拽、编辑等
|
|
240
|
+
* @param element
|
|
241
|
+
*/
|
|
242
|
+
Label.prototype.rewriteInnerMethods = function (element) {
|
|
243
|
+
// 重写 edgeModel/nodeModel moveText 方法,在 move text 时,以相同的逻辑移动 label
|
|
244
|
+
element.moveText = function (deltaX, deltaY) {
|
|
245
|
+
if (!element.text)
|
|
246
|
+
return;
|
|
247
|
+
var _a = element.text, x = _a.x, y = _a.y, value = _a.value, draggable = _a.draggable, editable = _a.editable;
|
|
248
|
+
element.text = {
|
|
249
|
+
value: value,
|
|
250
|
+
editable: editable,
|
|
251
|
+
draggable: draggable,
|
|
252
|
+
x: x + deltaX,
|
|
253
|
+
y: y + deltaY,
|
|
254
|
+
};
|
|
255
|
+
var properties = cloneDeep(element.getProperties());
|
|
256
|
+
// 重新计算新的 label 位置信息
|
|
257
|
+
if (isArray(properties._label)) {
|
|
258
|
+
var nextLabel = map(properties._label, function (label) {
|
|
259
|
+
return __assign(__assign({}, label), { x: label.x + deltaX, y: label.y + deltaY });
|
|
260
|
+
});
|
|
261
|
+
// console.log('Label --->>>', nextLabel)
|
|
262
|
+
element === null || element === void 0 ? void 0 : element.setProperty('_label', nextLabel);
|
|
263
|
+
}
|
|
264
|
+
};
|
|
265
|
+
// TODO: others methods ???
|
|
266
|
+
};
|
|
267
|
+
// private rewriteShortcut() {}
|
|
268
|
+
/**
|
|
269
|
+
* 更新当前渲染使用的 Text or Label 模式
|
|
270
|
+
*/
|
|
271
|
+
Label.prototype.updateTextMode = function (textMode) {
|
|
272
|
+
var editConfigModel = this.lf.graphModel.editConfigModel;
|
|
273
|
+
if (textMode === editConfigModel.textMode)
|
|
274
|
+
return;
|
|
275
|
+
editConfigModel.updateTextMode(textMode);
|
|
276
|
+
if (textMode === TextMode.LABEL) {
|
|
277
|
+
this.lf.tool.enableTool(LabelOverlay.toolName);
|
|
278
|
+
this.lf.tool.disableTool('text-edit-tool');
|
|
279
|
+
}
|
|
280
|
+
else if (textMode === TextMode.TEXT) {
|
|
281
|
+
this.lf.tool.enableTool('text-edit-tool');
|
|
282
|
+
this.lf.tool.disableTool(LabelOverlay.toolName);
|
|
283
|
+
}
|
|
284
|
+
};
|
|
285
|
+
Label.prototype.render = function () { };
|
|
286
|
+
Label.prototype.destroy = function () { };
|
|
287
|
+
Label.pluginName = 'Label';
|
|
288
|
+
return Label;
|
|
289
|
+
}());
|
|
290
|
+
export { Label };
|
|
291
|
+
export default Label;
|
|
292
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tools/label/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import MediumEditor from 'medium-editor';
|
|
2
|
+
export declare const defaultOptions: {
|
|
3
|
+
toolbar: {
|
|
4
|
+
allowMultiParagraphSelection: boolean;
|
|
5
|
+
buttons: string[];
|
|
6
|
+
standardizeSelectionStart: boolean;
|
|
7
|
+
updateOnEmptySelection: boolean;
|
|
8
|
+
};
|
|
9
|
+
placeholder: {
|
|
10
|
+
text: string;
|
|
11
|
+
hideOnClick: boolean;
|
|
12
|
+
};
|
|
13
|
+
disableEditing: boolean;
|
|
14
|
+
};
|
|
15
|
+
export declare const ColorPickerButton: any;
|
|
16
|
+
export { MediumEditor };
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import MediumEditor from 'medium-editor';
|
|
2
|
+
import Picker from 'vanilla-picker';
|
|
3
|
+
import rangy from 'rangy';
|
|
4
|
+
export var defaultOptions = {
|
|
5
|
+
toolbar: {
|
|
6
|
+
allowMultiParagraphSelection: true,
|
|
7
|
+
buttons: [
|
|
8
|
+
'bold',
|
|
9
|
+
'colorpicker',
|
|
10
|
+
'italic',
|
|
11
|
+
'underline',
|
|
12
|
+
'strikethrough',
|
|
13
|
+
'quote',
|
|
14
|
+
'justifyLeft',
|
|
15
|
+
'justifyCenter',
|
|
16
|
+
'justifyRight',
|
|
17
|
+
'justifyFull',
|
|
18
|
+
'superscript',
|
|
19
|
+
'subscript',
|
|
20
|
+
'orderedlist',
|
|
21
|
+
'unorderedlist',
|
|
22
|
+
'pre',
|
|
23
|
+
'removeFormat',
|
|
24
|
+
'outdent',
|
|
25
|
+
'indent',
|
|
26
|
+
'h2',
|
|
27
|
+
'h3',
|
|
28
|
+
],
|
|
29
|
+
standardizeSelectionStart: false,
|
|
30
|
+
updateOnEmptySelection: false,
|
|
31
|
+
},
|
|
32
|
+
placeholder: {
|
|
33
|
+
text: '请输入内容',
|
|
34
|
+
hideOnClick: true,
|
|
35
|
+
},
|
|
36
|
+
disableEditing: true,
|
|
37
|
+
};
|
|
38
|
+
export var ColorPickerButton = MediumEditor.extensions.button.extend({
|
|
39
|
+
name: 'colorpicker',
|
|
40
|
+
tagNames: ['mark'],
|
|
41
|
+
contentDefault: '<b>Color</b>',
|
|
42
|
+
aria: 'Color Picker',
|
|
43
|
+
action: 'colorPicker',
|
|
44
|
+
init: function () {
|
|
45
|
+
var _this = this;
|
|
46
|
+
rangy.init();
|
|
47
|
+
MediumEditor.extensions.button.prototype.init.call(this);
|
|
48
|
+
this.colorPicker = new Picker({
|
|
49
|
+
parent: this.button,
|
|
50
|
+
color: '#000',
|
|
51
|
+
onDone: function (res) {
|
|
52
|
+
if (_this.coloredText && _this.coloredText.isAppliedToSelection()) {
|
|
53
|
+
_this.coloredText.undoToSelection();
|
|
54
|
+
}
|
|
55
|
+
_this.coloredText = rangy.createClassApplier('colored', {
|
|
56
|
+
elementTagName: 'span',
|
|
57
|
+
elementProperties: {
|
|
58
|
+
style: {
|
|
59
|
+
color: res.hex,
|
|
60
|
+
},
|
|
61
|
+
},
|
|
62
|
+
normalize: true,
|
|
63
|
+
});
|
|
64
|
+
_this.coloredText.toggleSelection();
|
|
65
|
+
_this.base.checkContentChanged();
|
|
66
|
+
_this.setInactive();
|
|
67
|
+
},
|
|
68
|
+
});
|
|
69
|
+
},
|
|
70
|
+
getButton: function () {
|
|
71
|
+
return this.button;
|
|
72
|
+
},
|
|
73
|
+
handleClick: function () {
|
|
74
|
+
this.setActive();
|
|
75
|
+
this.colorPicker.show();
|
|
76
|
+
},
|
|
77
|
+
isAlreadyApplied: function (node) {
|
|
78
|
+
return node.nodeName.toLowerCase() === 'mark';
|
|
79
|
+
},
|
|
80
|
+
isActive: function () {
|
|
81
|
+
return this.button.classList.contains('medium-editor-button-active');
|
|
82
|
+
},
|
|
83
|
+
setInactive: function () {
|
|
84
|
+
this.button.classList.remove('medium-editor-button-active');
|
|
85
|
+
},
|
|
86
|
+
setActive: function () {
|
|
87
|
+
this.button.classList.add('medium-editor-button-active');
|
|
88
|
+
},
|
|
89
|
+
});
|
|
90
|
+
export { MediumEditor };
|
|
91
|
+
//# sourceMappingURL=mediumEditor.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mediumEditor.js","sourceRoot":"","sources":["../../../src/tools/label/mediumEditor.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import LogicFlow, { BaseEdgeModel, BaseNodeModel, BezierEdgeModel } from '@logicflow/core';
|
|
2
|
+
import Point = LogicFlow.Point;
|
|
3
|
+
import LabelConfig = LogicFlow.LabelConfig;
|
|
4
|
+
export type BBoxInfo = {
|
|
5
|
+
x: number;
|
|
6
|
+
y: number;
|
|
7
|
+
width: number;
|
|
8
|
+
height: number;
|
|
9
|
+
};
|
|
10
|
+
export declare function calcPointAfterResize(origin: BBoxInfo, scaled: BBoxInfo, point: Point): Point;
|
|
11
|
+
export declare function rotatePointAroundCenter(target: Point, center: Point, radian: number): Point;
|
|
12
|
+
/** Edge 相关工具方法 */
|
|
13
|
+
/**
|
|
14
|
+
* 获取某点在一个矩形图形(节点 or 边的 outline)内的偏移量
|
|
15
|
+
* @param point 目标点(此处即 Label 的坐标信息)
|
|
16
|
+
* @param element 目标元素
|
|
17
|
+
*/
|
|
18
|
+
export declare const getPointOffsetOfElementOutline: (point: Point, element: BaseNodeModel | BaseEdgeModel) => {
|
|
19
|
+
xDeltaPercent: number;
|
|
20
|
+
yDeltaPercent: number;
|
|
21
|
+
xDeltaDistance: number;
|
|
22
|
+
yDeltaDistance: number;
|
|
23
|
+
} | undefined;
|
|
24
|
+
/**
|
|
25
|
+
* 给定一个点 P = (x_0, y_0) 和线段的两个端点 A = (x_1, y_1) 和 B = (x_2, y_2) ,可以使用以下步骤计算点到线段的距离:
|
|
26
|
+
* 1. 计算向量 AB 和 AP 。
|
|
27
|
+
* 2. 计算 AB 的平方长度。
|
|
28
|
+
* 3. 计算点 P 在直线 AB 上的投影点 Q 。
|
|
29
|
+
* 4. 判断 Q 是否在线段 AB 上。
|
|
30
|
+
* 5. 根据 Q 是否在线段上,计算点到线段的距离。
|
|
31
|
+
*
|
|
32
|
+
* 计算点到线段质检的距离
|
|
33
|
+
* @param point
|
|
34
|
+
* @param start
|
|
35
|
+
* @param end
|
|
36
|
+
*/
|
|
37
|
+
export declare const pointToSegmentDistance: (point: Point, start: Point, end: Point) => number;
|
|
38
|
+
export declare const calcPolylineTotalLength: (points: Point[]) => number;
|
|
39
|
+
/**
|
|
40
|
+
* TODO: 确认该函数的意义,写完还是没看懂什么意思
|
|
41
|
+
* @param point
|
|
42
|
+
* @param points
|
|
43
|
+
*/
|
|
44
|
+
export declare const pointPositionRatio: (point: Point, points: Point[]) => number;
|
|
45
|
+
/**
|
|
46
|
+
* 计算一个坐标在贝塞尔曲线上最近的一个点
|
|
47
|
+
* @param point
|
|
48
|
+
* @param edge
|
|
49
|
+
* @param step
|
|
50
|
+
*/
|
|
51
|
+
export declare const calcClosestPointOnBezierEdge: (point: Point, edge: BezierEdgeModel, step?: number) => Point;
|
|
52
|
+
export declare const getNewPointAtDistance: (points: Point[], ratio: number) => Point | undefined;
|
|
53
|
+
/**
|
|
54
|
+
* 计算一个坐标离折线(包括 PolylineEdge 和 LineEdge 直线)最近的一个点
|
|
55
|
+
* @param point
|
|
56
|
+
* @param edge
|
|
57
|
+
*/
|
|
58
|
+
export declare const calcLabelPositionOnPolyline: (point: Point, edge: BaseEdgeModel) => Point;
|
|
59
|
+
/**
|
|
60
|
+
* 计算 Label 离边最近的点的坐标,用于更新为 Label 的坐标
|
|
61
|
+
* @param label LabelConfig -> 当前 Label 的配置项
|
|
62
|
+
* @param edge
|
|
63
|
+
*/
|
|
64
|
+
export declare const getLabelPositionOfLine: (label: LabelConfig, edge: BaseEdgeModel) => Point;
|