feat: createWidget and clearWidget (#3337)

* feat: createWidget and clearWidget * feat: createWidget and clearWidget * feat: 手动触发transofrom和clear * chore: code optimize * chore: code optimize
antvis · Mar 16, 2023 · 4b1a0f8 · 4b1a0f8
1 parent ac71e23
commit 4b1a0f8
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 2 deletions.
diff --git a/packages/x6-plugin-transform/src/api.ts b/packages/x6-plugin-transform/src/api.ts
@@ -1,5 +1,30 @@
+import { Graph, Node } from '@antv/x6'
 import { TransformImpl } from './transform'
+import { Transform } from './index'
+
+declare module '@antv/x6/lib/graph/graph' {
+  interface Graph {
+    createTransformWidget: (node: Node) => Graph
+    clearTransformWidgets: () => Graph
+  }
+}
 
 declare module '@antv/x6/lib/graph/events' {
   interface EventArgs extends TransformImpl.EventArgs {}
 }
+
+Graph.prototype.createTransformWidget = function (node) {
+  const transform = this.getPlugin('transform') as Transform
+  if (transform) {
+    transform.createWidget(node)
+  }
+  return this
+}
+
+Graph.prototype.clearTransformWidgets = function () {
+  const transform = this.getPlugin('transform') as Transform
+  if (transform) {
+    transform.clearWidgets()
+  }
+  return this
+}
diff --git a/packages/x6-plugin-transform/src/index.ts b/packages/x6-plugin-transform/src/index.ts
@@ -50,7 +50,7 @@ export class Transform extends Basecoat<Transform.EventArgs> {
     return !this.disabled
   }
 
-  protected onNodeClick({ node }: EventArgs['node:click']) {
+  createWidget(node: Node) {
     this.clearWidgets()
     const widget = this.createTransform(node)
     if (widget) {
@@ -62,6 +62,10 @@ export class Transform extends Basecoat<Transform.EventArgs> {
     }
   }
 
+  protected onNodeClick({ node }: EventArgs['node:click']) {
+    this.createWidget(node)
+  }
+
   protected onBlankMouseDown() {
     this.clearWidgets()
   }
@@ -135,7 +139,7 @@ export class Transform extends Basecoat<Transform.EventArgs> {
     return options
   }
 
-  protected clearWidgets() {
+  clearWidgets() {
     this.widgets.forEach((widget, node) => {
       if (this.graph.getCellById(node.id)) {
         widget.dispose()

diff --git a/sites/x6-sites/docs/tutorial/plugins/transform.zh.md b/sites/x6-sites/docs/tutorial/plugins/transform.zh.md
@@ -55,6 +55,17 @@ graph.use(
 
 ## 配置
 
+
+## API
+
+### graph.createTransformWidget(node: Node)
+
+给节点创建widget
+
+### graph.clearTransformWidgets()
+
+清除所有widget
+
 ### 调整尺寸
 
 | 属性名              | 类型    | 默认值     | 必选 | 描述                                         |