topo-engine 0.1.8 → 0.1.9
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/README.md +22 -1
- package/dist/index.d.ts +55 -44
- package/dist/style.css +11 -11
- package/dist/topo-engine.cjs +887 -140
- package/dist/topo-engine.cjs.map +1 -1
- package/dist/topo-engine.js +887 -140
- package/dist/topo-engine.js.map +1 -1
- package/dist/topo-engine.umd.cjs +887 -140
- package/dist/topo-engine.umd.cjs.map +1 -1
- package/docs/API.md +113 -31
- package/package.json +1 -1
package/docs/API.md
CHANGED
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
## 目录
|
|
8
8
|
|
|
9
9
|
- [快速开始](#快速开始)
|
|
10
|
+
- [引用规则(id / psrId / assetNo 统一)](#引用规则id--psrid--assetno-统一)
|
|
10
11
|
- [类型定义](#类型定义)
|
|
11
12
|
- [一、查询 API](#一查询-api)
|
|
12
13
|
- [二、视图控制](#二视图控制)
|
|
@@ -24,6 +25,42 @@
|
|
|
24
25
|
|
|
25
26
|
---
|
|
26
27
|
|
|
28
|
+
## 引用规则(id / psrId / assetNo 统一)
|
|
29
|
+
|
|
30
|
+
> 引擎内所有「目标 / 节点 / 设备 / 用户」入参(下称 `ref`)**统一接受三种引用**,
|
|
31
|
+
> 方法与场景无关,传内部 id、psrId 还是资产编号由调用方自由决定:
|
|
32
|
+
|
|
33
|
+
| 引用 | 命中对象 | 典型值 |
|
|
34
|
+
| --- | --- | --- |
|
|
35
|
+
| 节点内部 `id` | 普通节点 | `'1'`、`'40'` |
|
|
36
|
+
| `psrId`(设备编码) | 普通节点(变压器/开关/导线点/计量箱…) | `'8ff4786d548a7073a2517297e801518ff456732f4d'` |
|
|
37
|
+
| `assetNo`(资产编号,兼容 `consNo`/`consId`) | 计量箱内该户 **电表户** | `'4230010007008084768'` |
|
|
38
|
+
|
|
39
|
+
**命中「箱内电表户」后的语义(按函数类型):**
|
|
40
|
+
|
|
41
|
+
- **视觉 / 定位 / 动画**(`locateNode`、`highlightNode`、`setNodeGlow`、`setNodePulse`、
|
|
42
|
+
`setText`、`setNodeColor`、`getNodePosition`、组件 `selectNode`…)→ **精确作用在该户表位**:
|
|
43
|
+
光环/高亮环/脉动/文字/染色画在该格电表上,定位聚焦表位中心;
|
|
44
|
+
- **查询 / 拓扑**(`getNode`、`getNeighbors`、`getStreamNodes`、`getSubtreeNodes`、
|
|
45
|
+
`getPath`、`getEdge*`…)→ 该户**按所在计量箱参与拓扑**:
|
|
46
|
+
`getNode(assetNo)` 返回所在箱节点副本并附带 `customer / customerIndex / customerCount / targetKind:'customer'`;
|
|
47
|
+
- **通用节点样式**(`setNodeStyle` 等)→ 作用于其所在计量箱节点;
|
|
48
|
+
- **卡片**(`showCard(assetNo)`)→ 卡片定位在该户表位旁,内容缺省按客户档案自动生成。
|
|
49
|
+
|
|
50
|
+
**辅助解析(业务判断用):**
|
|
51
|
+
|
|
52
|
+
```js
|
|
53
|
+
const t = topo.resolveRef('4230010007008084768');
|
|
54
|
+
// → { kind:'customer', boxId:'40', boxNode, index:0, customer:{…}, key:'40#cust0', assetNo, name }
|
|
55
|
+
const c = topo.getCustomer('4230010007008084768');
|
|
56
|
+
// → { node, customer, index, count, boxId } | null
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
> 说明:`findNodes` / `getAllNodes` 等**无目标入参**的聚合查询保持原语义(返回模型节点,不含电表户,
|
|
60
|
+
> 电表户从箱节点的 `_customers` 中读取)。连线/拓扑线端点本就支持 id/psrId/assetNo。
|
|
61
|
+
|
|
62
|
+
---
|
|
63
|
+
|
|
27
64
|
## 快速开始
|
|
28
65
|
|
|
29
66
|
```vue
|
|
@@ -205,18 +242,19 @@ interface ConnectionOptions {
|
|
|
205
242
|
|
|
206
243
|
## 一、查询 API
|
|
207
244
|
|
|
208
|
-
### `getNode(
|
|
245
|
+
### `getNode(ref)`
|
|
209
246
|
|
|
210
|
-
|
|
247
|
+
获取单个目标(节点 / 箱内电表户)完整数据。
|
|
211
248
|
|
|
212
249
|
```ts
|
|
213
|
-
getNode(
|
|
250
|
+
getNode(ref: string): NodeData | null
|
|
214
251
|
```
|
|
215
252
|
|
|
216
253
|
**参数:**
|
|
217
|
-
- `
|
|
254
|
+
- `ref` — 节点 id / psrId / 资产编号 assetNo(见[引用规则](#引用规则id--psrid--assetno-统一))
|
|
218
255
|
|
|
219
|
-
**返回:**
|
|
256
|
+
**返回:** 命中普通节点返回模型节点;命中电表户返回**其所在计量箱节点副本**,
|
|
257
|
+
并附带 `customer`(客户档案)、`customerIndex`、`customerCount`、`targetKind:'customer'`;未找到返回 `null`
|
|
220
258
|
|
|
221
259
|
**示例:**
|
|
222
260
|
```js
|
|
@@ -391,12 +429,12 @@ getMainEdge(): EdgeData[]
|
|
|
391
429
|
|
|
392
430
|
---
|
|
393
431
|
|
|
394
|
-
### `getNodePosition(
|
|
432
|
+
### `getNodePosition(ref)`
|
|
395
433
|
|
|
396
|
-
|
|
434
|
+
获取节点 / 户表位中心坐标(assetNo → 该户表位中心)。
|
|
397
435
|
|
|
398
436
|
```ts
|
|
399
|
-
getNodePosition(
|
|
437
|
+
getNodePosition(ref: string): { x: number; y: number } | null
|
|
400
438
|
```
|
|
401
439
|
|
|
402
440
|
---
|
|
@@ -491,16 +529,16 @@ zoomOut(step?: number): void
|
|
|
491
529
|
|
|
492
530
|
---
|
|
493
531
|
|
|
494
|
-
### `locateNode(
|
|
532
|
+
### `locateNode(ref, zoom?)`
|
|
495
533
|
|
|
496
|
-
|
|
534
|
+
定位目标到视口中央(节点中心 / 户表位中心),可选缩放。
|
|
497
535
|
|
|
498
536
|
```ts
|
|
499
|
-
locateNode(
|
|
537
|
+
locateNode(ref: string, zoom?: number): void
|
|
500
538
|
```
|
|
501
539
|
|
|
502
540
|
**参数:**
|
|
503
|
-
- `
|
|
541
|
+
- `ref` — 节点 id / psrId / 资产编号 assetNo
|
|
504
542
|
- `zoom` — 可选的目标缩放比例
|
|
505
543
|
|
|
506
544
|
**示例:**
|
|
@@ -526,12 +564,12 @@ getViewport(): { zoom: number; center: { x: number; y: number } }
|
|
|
526
564
|
|
|
527
565
|
## 三、节点样式
|
|
528
566
|
|
|
529
|
-
### `setNodeStyle(
|
|
567
|
+
### `setNodeStyle(ref, style)`
|
|
530
568
|
|
|
531
|
-
|
|
569
|
+
设置单个目标的视觉样式(assetNo → 作用于所在计量箱节点)。
|
|
532
570
|
|
|
533
571
|
```ts
|
|
534
|
-
setNodeStyle(
|
|
572
|
+
setNodeStyle(ref: string, style: NodeStyle): void
|
|
535
573
|
```
|
|
536
574
|
|
|
537
575
|
**示例:**
|
|
@@ -730,12 +768,12 @@ resetEdgeStyle(srcId: string, tgtId: string): void
|
|
|
730
768
|
|
|
731
769
|
## 五、高亮与标注
|
|
732
770
|
|
|
733
|
-
### `highlightNode(
|
|
771
|
+
### `highlightNode(ref, options?)`
|
|
734
772
|
|
|
735
|
-
|
|
773
|
+
高亮目标(节点 → 金框 + 可选标注;箱内电表户 → 该户表位高亮环 + 可选标注)。
|
|
736
774
|
|
|
737
775
|
```ts
|
|
738
|
-
highlightNode(
|
|
776
|
+
highlightNode(ref: string, options?: HighlightOptions): void
|
|
739
777
|
```
|
|
740
778
|
|
|
741
779
|
**示例:**
|
|
@@ -823,12 +861,12 @@ topo.dimOthers(keep, 0.15);
|
|
|
823
861
|
|
|
824
862
|
## 六、动画
|
|
825
863
|
|
|
826
|
-
### `setNodePulse(
|
|
864
|
+
### `setNodePulse(ref, options?)`
|
|
827
865
|
|
|
828
|
-
|
|
866
|
+
目标脉动动画(节点 → 图元透明度呼吸;箱内电表户 → 该户电表格淡入淡出)。
|
|
829
867
|
|
|
830
868
|
```ts
|
|
831
|
-
setNodePulse(
|
|
869
|
+
setNodePulse(ref: string, options?: { duration?: number; min?: number; max?: number }): void
|
|
832
870
|
```
|
|
833
871
|
|
|
834
872
|
**示例:**
|
|
@@ -838,17 +876,60 @@ topo.setNodePulse('123', { color: '#FF0000', duration: 1500 });
|
|
|
838
876
|
|
|
839
877
|
---
|
|
840
878
|
|
|
841
|
-
### `setNodeGlow(
|
|
879
|
+
### `setNodeGlow(ref, options?)`
|
|
842
880
|
|
|
843
|
-
|
|
881
|
+
**节点光晕动画** —— 节点周围“扩散 + 渐隐”的发光环(两层光环、呼吸式循环),
|
|
882
|
+
用于告警 / 定位 / 状态强调等场景。
|
|
844
883
|
|
|
845
884
|
```ts
|
|
846
|
-
setNodeGlow(
|
|
885
|
+
setNodeGlow(ref: string, options?: {
|
|
886
|
+
color?: string; // 光晕颜色,默认 '#00C8FF'(青)
|
|
887
|
+
spread?: number; // 光环外扩半径 (px),默认 14
|
|
888
|
+
radius?: number; // spread 的别名(兼容早期文档)
|
|
889
|
+
duration?: number; // 一个周期时长 (ms),默认 1600
|
|
890
|
+
opacity?: number; // 光环最大透明度 (0-1),默认 0.9
|
|
891
|
+
}): boolean
|
|
892
|
+
```
|
|
893
|
+
|
|
894
|
+
**说明:**
|
|
895
|
+
- `ref` 支持 **节点内部 id / psrId(设备编码)** → 图元光环;
|
|
896
|
+
**客户 assetNo(资产编号,兼容 consNo/consId)→ 该户表位光环**(多户箱只亮那一格,单户箱即整箱那只表);
|
|
897
|
+
- 多个目标可同时发光;`removeAllAnimations()` 会一并停止光晕与脉动;
|
|
898
|
+
- 与「染色 / 高亮」互不冲突:光环画在图元之上、选中金框之下,随节点/表位对齐。
|
|
899
|
+
|
|
900
|
+
**示例:**
|
|
901
|
+
```js
|
|
902
|
+
// 默认青色光晕
|
|
903
|
+
topo.setNodeGlow('8ff4786d548a7073a2517297e801518ff456732f4d');
|
|
904
|
+
|
|
905
|
+
// 红色告警光晕(更亮、扩散更大、周期更快)
|
|
906
|
+
topo.setNodeGlow('8ff4…', { color: '#FF0000', spread: 20, duration: 900, opacity: 1 });
|
|
907
|
+
|
|
908
|
+
// 停止:removeNodeGlow(ref) / 停止全部 removeAllNodeGlows()
|
|
909
|
+
topo.removeNodeGlow('8ff4…');
|
|
847
910
|
```
|
|
848
911
|
|
|
849
912
|
---
|
|
850
913
|
|
|
851
|
-
### `
|
|
914
|
+
### `removeNodeGlow(ref)`
|
|
915
|
+
|
|
916
|
+
停止指定节点的光晕动画。
|
|
917
|
+
|
|
918
|
+
```ts
|
|
919
|
+
removeNodeGlow(ref: string): boolean
|
|
920
|
+
```
|
|
921
|
+
|
|
922
|
+
---
|
|
923
|
+
|
|
924
|
+
### `removeAllNodeGlows()`
|
|
925
|
+
|
|
926
|
+
停止全部节点的光晕动画。
|
|
927
|
+
|
|
928
|
+
```ts
|
|
929
|
+
removeAllNodeGlows(): void
|
|
930
|
+
```
|
|
931
|
+
|
|
932
|
+
---### `setEdgeFlow(srcId, tgtId, options?)`
|
|
852
933
|
|
|
853
934
|
边流动动画(视觉流动效果)。
|
|
854
935
|
|
|
@@ -895,12 +976,12 @@ removeAllAnimations(): void
|
|
|
895
976
|
|
|
896
977
|
## 七、文字标注
|
|
897
978
|
|
|
898
|
-
### `setText(
|
|
979
|
+
### `setText(ref, text, options?)`
|
|
899
980
|
|
|
900
|
-
|
|
981
|
+
在目标旁设置附加文字(节点 → 节点旁标注;箱内电表户 → 表位上方小标注)。
|
|
901
982
|
|
|
902
983
|
```ts
|
|
903
|
-
setText(
|
|
984
|
+
setText(ref: string, text: string, options?: {
|
|
904
985
|
fontSize?: number; // 默认 12
|
|
905
986
|
color?: string; // 默认 '#FFFFFF'
|
|
906
987
|
position?: 'top' | 'bottom' | 'left' | 'right'; // 默认 'top'
|
|
@@ -968,12 +1049,13 @@ changeUserName(mode: 'full' | 'short' | 'hidden'): void
|
|
|
968
1049
|
|
|
969
1050
|
## 八、卡片盒
|
|
970
1051
|
|
|
971
|
-
### `showCard(
|
|
1052
|
+
### `showCard(ref, content?)`
|
|
972
1053
|
|
|
973
|
-
|
|
1054
|
+
在节点 / 箱内电表户旁弹出信息卡片(assetNo → 卡片定位在该户表位旁)。
|
|
1055
|
+
`content` 可省略:不传时自动按「设备信息 / 客户档案」生成 `title` 与 `fields`。
|
|
974
1056
|
|
|
975
1057
|
```ts
|
|
976
|
-
showCard(
|
|
1058
|
+
showCard(ref: string, content?: CardContent): void
|
|
977
1059
|
```
|
|
978
1060
|
|
|
979
1061
|
**示例:**
|