SOURCE

const data = {
  nodes: [
//    {
//      id: 'L1',
//      label: '渠道层',
//      type: 'rect',
//      x: 300,
//      y: 50,
//      size: [600,60],
//      comboId: 'a',
//    },
      {
        x: 100,
        y: 50,
        size: [50,30],
        type: 'rect',
        label: '手机银行APP',
        id: 'node1',
        comboId: 'a',
      },
      {
        x: 200,
        y: 50,
        size: [50,30],
        type: 'rect',
        label: '微信银行',
        id: 'node2',
        comboId: 'a',
      },
      {
        x: 300,
        y: 50,
        size: [50,30],
        type: 'rect',
        label: '好会化微信公众号',
        id: 'node3',
        comboId: 'a',
      },
      {
        x: 400,
        y: 50,
        size: [50,30],
        type: 'rect',
        label: '六度闪付',
        id: 'node4',
        comboId: 'a',
      },
  ],
  combos: [
    {
      id: 'a',
      type: 'rect',
      x: 200,
      y: 50,
      size: [400,60],
      fixCollapseSize: [5,5],
      label: 'L1',
    },
  ],
};

// colorize the nodes and combos
const subjectColors = [
  '#5F95FF', // blue
  '#61DDAA',
  '#65789B',
  '#F6BD16',
  '#7262FD',
  '#78D3F8',
  '#9661BC',
  '#F6903D',
  '#008685',
  '#F08BB4',
];

const itemMap = {};
const backColor = '#fff';
const theme = 'default';
const disableColor = '#777';
const colorSets = G6.Util.getColorSetsBySubjectColors(
  subjectColors,
  backColor,
  theme,
  disableColor,
);

data.combos.forEach((combo, i) => {
  const color = colorSets[i % colorSets.length];
  combo.style = {
    stroke: '#5F95FF',
    fill: color.mainFill,
    opacity: 0.8
  }
//  itemMap[combo.id].style = { ...combo.style }
})

const container = document.getElementById('container');
const width = container.scrollWidth;
const height = (container.scrollHeight || 500) - 160;
const graph = new G6.Graph({
  container: 'container',
  width: 800,
  height: 500,
  defaultCombo: {
    collapsedSubstituteIcon: {
      show: 'true',
      img: 'https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*IEQFS5VtXX8AAAAAAAAAAABkARQnAQ',
      width: 10,
      height: 10
    }
  },
  modes: {
    default: ['drag-combo', 'drag-node', 'drag-canvas', 'zoom-canvas', 'collapse-expand-combo'],
  },
});
graph.data(data);
graph.render();

<script src="https://gw.alipayobjects.com/os/lib/antv/g6/4.0.3/dist/g6.min.js"></script>

<div id="container" />