Echarts在线免费图表

 
            var target = '攻击对象'
option = {
  tooltip: {},
  animationDurationUpdate: 1500,
  animationEasingUpdate: 'quinticInOut',
  series: [
    {
      type: 'graph',
      layout: 'force', // 使用力导向布局
      force: {
        repulsion: 1500,// 球与球之间的斥力
        edgeLength: 200, // 线的长度
      },
      symbolSize: 90,
      roam: true,
      itemStyle: {
        color: '#ec808d'
      },
      label: {
        show: true,
        color: '#fff',
        fontSize: '12'
      },
      edgeSymbol: ['circle', 'arrow'],
      edgeSymbolSize: [4, 10],
      edgeLabel: {
        fontSize: 14,
        show: true,
        color: '#666',
        formatter: (params) => {
          return params.data.name || ''
        }
      },
      data: [
        {
          name: '192.168.1.118',
          value: 55,
          symbolSize: calculateSymbolSize(55)
        },
        {
          name: '172.18.9.10',
          value: 6,
          symbolSize: calculateSymbolSize(6)
        },
        {
          name: target,
          value: 25,
          symbolSize: 100
        },
        {
          name: '182.17.9.21',
          value: 15,
          symbolSize: calculateSymbolSize(15)
        },
        {
          name: '172.16.1.18',
          value: 8,
          symbolSize: calculateSymbolSize(8)
        },
        {
          name: '168.2.15.19',
          value: 85,
          symbolSize: calculateSymbolSize(165)
        }
      ],
      links: [
        {
          source: '192.168.1.118',
          target,
        },
        {
          source: target,
        },
        {
          source: '168.2.15.19',
          target,
          // name: '消息接入'
        },
        {
          source: '182.17.9.21',
          target
        },
        {
          source: '172.16.1.18',
          target
        },
        {
          source: '172.18.9.10',
          target
        }
      ],
      lineStyle: {
        color: '#12b5d0',
        opacity: 0.9,
        width: 1,
        curveness: 0,
        type: 'dashed'
      }
    }
  ]
};

function calculateSymbolSize(value) {
  var maxValue = 100; // 假设最大值为165
  var maxSymbolSize = 100; // 最大球的半径为100
  var symbolSize = (value / maxValue) * maxSymbolSize;
  if (value / maxValue < 0.5) {
    return 50
  } else {
    return symbolSize;
  }
}