echarts人物关系力道向图

ECharts是一个基于JavaScript的可视化库，可以用于制作各种图表，包括人物关系力道向图。人物关系力道向图可以用于展示人物之间的关系和权力等级，以下是一个示例：

// 引入echarts
import echarts from 'echarts';

// 初始化echarts实例
const myChart = echarts.init(document.getElementById('main'));

// 配置项
const option = {
  title: {
    text: '人物关系力道向图',
    left: 'center'
  },
  tooltip: {},
  animationDurationUpdate: 1500,
  animationEasingUpdate: 'quinticInOut',
  series: [
    {
      type: 'graph',
      layout: 'force',
      symbolSize: 50,
      roam: true,
      label: {
        show: true
      },
      edgeSymbol: ['arrow', 'none'],
      edgeSymbolSize: [10, 5],
      edgeLabel: {
        fontSize: 20
      },
      data: [
        { name: '张三', draggable: true, category: 0 },
        { name: '李四', draggable: true, category: 0 },
        { name: '王五', draggable: true, category: 0 },
        { name: '赵六', draggable: true, category: 0 }
      ],
      categories: [
        { name: '主角' }
      ],
      force: {
        edgeLength: 100,
        repulsion: 200,
        gravity: 0.2
      },
      edges: [
        { source: '张三', target: '李四', symbolSize: [5, 20], label: { show: true } },
        { source: '李四', target: '王五', symbolSize: [5, 20], label: { show: true } },
        { source: '王五', target: '赵六', symbolSize: [5, 20], label: { show: true } }
      ]
    }
  ]
};

// 设置配置项并渲染图表
myChart.setOption(option);

以上代码会生成一个包含四个人物节点和三条连线的人物关系力道向图。其中，每个节点代表一个人物，连线代表两个人物之间的关系。节点和连线的样式可以通过配置项进行自定义，如节点大小、颜色、标签等。连线的样式也可以进行自定义，如箭头形状、连线宽度、标签等。

人物关系力道向图可以用于展示各种关系，如家族关系、政治关系、商业关系等。通过调整节点和连线的位置和样式，可以更加清晰地展示关系网络。