let dataInfo = [{
name: "蔚来汽车",
category: 0, // 层级关系
symbolSize: 50,
draggable: true,
fixed: true,
value: [0, 150],
// symbol: `image://${bubble1}` 自定义背景图
}, {
name: "威马汽车",
category: 0,
symbolSize: 80,
draggable: true,
fixed: true,
value: [600, 150]
}, {
name: "小鹏汽车",
category: 0,
value: [200, 200],
draggable: true,
fixed: true,
symbolSize: 50
}, {
name: "比亚迪",
category: 0,
value: [150, 140],
draggable: true,
fixed: true,
symbolSize: 50
}, {
name: "江淮汽车",
category: 0,
value: [200, 100],
draggable: false,
symbolSize: 50
}, {
name: "北汽新能源",
category: 0,
symbolSize: 50,
draggable: false,
value: [300, 200]
}]
let dataLink = [{
source: "蔚来汽车",
value: " ",
target: "比亚迪",
lineStyle: {
width: 1
}
},{
source: "比亚迪",
value: " ",
target: "蔚来汽车",
lineStyle: {
width: 3
}
},{
source: "蔚来汽车",
value: " ",
target: "威马汽车",
}, {
source: "蔚来汽车",
value: " ",
target: "小鹏汽车",
}, {
source: "威马汽车",
value: " ",
target: "小鹏汽车",
}, {
source: "比亚迪",
value: " ",
target: "小鹏汽车",
}, {
source: "比亚迪",
value: " ",
target: "威马汽车",
}, {
source: "北汽新能源",
value: " ",
target: "比亚迪",
}, {
source: "北汽新能源",
value: " ",
target: "蔚来汽车",
}, {
source: "北汽新能源",
value: " ",
target: "江淮汽车",
}, {
source: "江淮汽车",
value: " ",
target: "蔚来汽车",
}, {
source: "江淮汽车",
value: " ",
target: "比亚迪",
lineStyle: {
width: 3
}
}, {
source: "江淮汽车",
value: " ",
target: "威马汽车",
}, {
source: "威马汽车",
value: " ",
target: "北汽新能源",
}, {
source: "小鹏汽车",
value: " ",
target: "北汽新能源",
lineStyle: {
width: 5
}
}, {
source: "小鹏汽车",
value: " ",
target: "江淮汽车",
}]
option = {
title: {
text: "实体属性关系图",
top: "top",
left: "center"
},
itemStyle: {
normal: {
color: '#000',
},
shadowBlur: 10
},
animationDuration: 1500,
animationEasingUpdate: 'quinticInOut',
xAxis: {
show: false,
type: 'value'
},
yAxis: {
show: false,
type: 'value'
},
series: [{
type: 'graph',
coordinateSystem: 'cartesian2d',
legendHoverLink: false,
hoverAnimation: true,
nodeScaleRatio: false,
// 是否要箭头
edgeSymbol: ['circle', 'none'],
edgeSymbolSize: [2, 15],
edgeLabel: {
show: false,
normal: {
show: true,
position: 'middle',
textStyle: {
fontSize: 12
},
formatter: "{c}"
}
},
focusNodeAdjacency: true,
roam: true,
categories: [{
name: '一级关系',
itemStyle: { // 可配置颜色
normal: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0.1, color: '#A1C3D6'},
{offset: 0.6, color: '#186C9B'},
{offset: 0.95, color: '#A1C3D6'},
]),
}
}
}],
//圆形上面的文字
label: {
normal: {
position: "inside",
show: true,
textStyle: {
color: '#fff',
fontSize: 12
},
}
},
force: {
repulsion: 1000,
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 1, 1, [{
offset: 0,
color: '#000eff'
}, {
offset: 1,
color: '#35c2ff'
}]),
},
shadowBlur: 10
},
lineStyle: {
normal: {
width: 1,
shadowColor: 'none',
color: '#000'
},
},
data: dataInfo,
links: dataLink
}]
}
