这用的是echart的哪个类型？-灵析社区
WhatUpDanger
中年复健狗用的是关系图，布局选 "none"，然后设置 "x, y" 的位置相对容易实现
写了个简单例子：
option = {
title: {
text: 'ECharts 关系图示例'
},
tooltip: {},
animationDurationUpdate: 1500,
animationEasingUpdate: 'quinticInOut',
series: [
{
type: 'graph',
layout: 'none',
data: [
{name: 'ThinkYMF', symbolSize: 80, x: 105, y: 105},
{name: '化工', symbolSize: 80,x: 100, y: 100},
{name: '建材', symbolSize: 80,x: 110, y: 100},
{name: '化工2', symbolSize: 80,x: 110, y: 110},
{name: '建材2', symbolSize: 80,x: 100, y: 110},
],
// 在这里设置节点间的连线
links: [
{source: '化工', target: 'ThinkYMF'},
{source: '建材', target: 'ThinkYMF'},
{source: '化工2', target: 'ThinkYMF'},
{source: '建材2', target: 'ThinkYMF'},
],
// 设置节点的样式
itemStyle: {
borderColor: '#fff',
borderWidth: 1,
shadowBlur: 10,
shadowColor: 'rgba(0, 0, 0, 0.3)'
},
// 设置线的样式
lineStyle: {
color: 'source', // 根据source节点的颜色决定线的颜色
},
// 设置标签样式（节点上的文字）
label: {
show: true
}
}
]
};
效果：
"image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241029/6bdc47fce32d061bfe5d4917287e4e45.png)
如果定位有规律也可以具体实现一个函数计算位置，上面只写了个简单的案例
«"官方文档 -> 关系图" (https://link.segmentfault.com/?enc=Wr1G7gZtT9cj31t6RXowQQ%3D%3D.HlBcKRSesdCJD13INHbM%2FCuX%2FWRYU6xoSsa%2BwF%2BfLWhcv%2F%2FKelfCaiOImr08ClOHBHu0ldRQ%2F%2FQGCQxpp0jivSJNb1VI1%2FkjFCs%2Fip66XLA%3D)»