feat: 新增画布onloaded方法

feat: 新增画布onloaded方法

Author: noonnightstorm

README.en-US.md

@@ -85,6 +85,7 @@ the configuration of canvas
 | delayDraw | Delayed rendering. This component must ensure that the canvas container rendering (including animation execution) is completed before rendering, otherwise the coordinates will be offset, for example：Animation of Ant Design Modal | <font color="c41d7f"> number</font> | 0 |
 | autoLayout | custom layout | [autoLayout Prop](#auto-layout-prop)<font color="c41d7f"> {}</font> | - |
 | diffOptions | Collection of diff fields for node updates| Array&#60; string&#62; | - |
+| onLoaded | canvas loaded event| (data: {nodes, edges, groups}) => {} | - |
 
 <br>
 

README.md

@@ -83,6 +83,8 @@ npm install react-monitor-dag
 | delayDraw | 是否延迟加载 | <font color="c41d7f"> number</font> | 0 |
 | autoLayout | 自定义布局 | [autoLayout Prop](#auto-layout-prop)<font color="c41d7f"> {}</font> | - |
 | diffOptions | 节点更新时diff的字段集合| Array&#60; string&#62; | - |
+| onLoaded | 画布渲染之后的回调| (data: {nodes, edges, groups}) => {} | - |
+
 <br>
 
 ### <a name='edge-prop'></a><b>edge</b>

package.json

@@ -1,6 +1,6 @@
 {
  "name": "react-monitor-dag",
- "version": "1.0.18",
+ "version": "1.0.19",
  "description": "一个基于React的运维/监控DAG图",
  "main": "dist/index.js",
  "pack": "pack/index.js",

src/index.tsx

@@ -84,6 +84,7 @@ interface ComProps {
  onContextmenuEdge?(edge: any): void, // 右键线段事件
  onContextmenuGroup?(edge: any): void, // 右键线段事件
  onChangePage?(data:any): void, // 分页事件
+ onLoaded?(data: any): void // 画布加载完成之后的回调
 }
 
 export default class MonitorDag extends React.Component<ComProps, any> {
@@ -178,7 +179,8 @@ export default class MonitorDag extends React.Component<ComProps, any> {
  }
  this.canvas = new Canvas(canvasObj);
  setTimeout(() => {
- this.canvas.draw(result, () => {
+ this.canvas.draw(result, (data) => {
+ this.props.onLoaded && this.props.onLoaded(data);
  let minimap = _.get(this, 'props.config.minimap', {});
  const minimapCfg = _.assign({}, minimap.config, {
  events: [