antv/g6 流程布局图

renderG6 = () => {
  const {exerciseInfoTree} = this.props
  let nodes = []
  let edges = []
  let widthX = 0
  const data = {
    nodes: nodes,
    edges: edges,
  };
  const container = document.getElementById('container');
  this.graph = new G6.Graph({
    container: container,
    width: widthX + 50,
    height: exerciseInfoTree.length * 38,
    modes: {
      default: ['drag-node'],
    },
    defaultNode: {
      size: [45, 25],
      type: 'rect',
      style: {
        lineWidth: 1,
        stroke: 'rgba(0, 0, 0, 0.5)',
        fill: 'rgba(0, 0, 0, 0.07)',
        radius: 2,
      },
    },
    defaultEdge: {
      type: 'polyline',
    },
  });
  this.graph.cfg.data = data
  this.graph.render()
}