antdv-X6图形汇总

2023-01-30  本文已影响0人  花影_62b4
image.png
//菱形
graph.addNode({
  shape: 'polygon',
  x: 40,
  y: 40,
  width: 80,
  height: 80,
  label: 'polygon',
  attrs: {
    body: {
      fill: '#efdbff',
      stroke: '#9254de',
      refPoints: '0,10 10,0 20,10 10,20',
    },
  },
})
//正五边形
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '100,10 190,78 160,198 40,198  10,78',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})
//正六边形
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '100,27 300,27 400,200 300,373 100,373 0,200',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})
//正八边形
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '0,1.41 1.41,0 3.41,0 4.82,1.41 4.82,3.41 3.41,4.82 1.41,4.82 0,3.41 ',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})
//圆形
graph.addNode({
  shape: 'circle',
  x: 200,
  y: 40,
  width: 60,
  height: 60,
  label: 'circle',
  attrs: {
    body: {
      fill: '#efdbff',
      stroke: '#9254de',
    },
  },
})
//卡片
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '0,10 8,0 20,0 20,40 0,40',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})
//人工输入
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '0,10 30,0 30,40 0,40',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})
//人工操作
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '0,0 40,0 30,40 10,40',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})
//标签
graph.addNode({
  shape: 'polygon',
  x: 180,
  y: 180,
  width: 80,
  height: 80,
  points: '0,0 20,0 20,40 10,30 0,40',
  attrs: {
    body: {
      fill: '#ffd591',
      stroke: '#ffa940',
      strokeWidth: 2,
      fillRule: 'evenodd',
    },
  },
})




上一篇 下一篇

猜你喜欢

热点阅读