公司业务一体化体系echarts graph配置项内容和展示
有三个问题，1、拖拽时可以固定节点位置。 2、文字的大小随着节点的变化而变化 3、颜色相同的数据分区展示。可以跟外部有连线，但是相同颜色的在一起。
配置项如下
option = {
title: {
text: "公司业务一体化体系",
top: "top",
left: "center"
},
tooltip: {
show: true,
},
legend: [{
left: "auto",
top: 20,
data: [{
"name": "辅助保障"
}, {
"name": "资源保障"
}, {
"name": "电网业务"
}]
}],
toolbox: {
show: true,
feature: {
dataView: {
show: true,
readOnly: true
},
restore: {
show: true
},
saveAsImage: {
show: true
}
}
},
animationDuration: 1500,
animationEasingUpdate: 'quinticInOut',
series: [{
type: 'graph',
layout: 'force',
// 设置节点样式
symbol: 'roundRect',
// 设置节点大小
symbolSize: function(value, params) {
return [params.data.displayname.length * 10, 45];
},
color:['#8a718a' , '#419ea3', '#549e8b'],
force: {
//initLayout:'circular' // 力引导的初始化布局，默认使用xy轴的标点
edgeLength: 80,
repulsion: 100,
gravity: 0.02
},
data: [{
"name": "AJ-10",
"displayname": "AJ-10\n应急体系（队伍）建设",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-11",
"displayname": "AJ-11\n建立应急预案",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-12",
"displayname": "AJ-12\n应急培训与演练",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-13",
"displayname": "AJ-13\n突发事件发生上报",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-14",
"displayname": "AJ-14\n启动应急预案",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-15",
"displayname": "AJ-15\n应急抢修救援",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-16",
"displayname": "AJ-16\n应急评估",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-17",
"displayname": "AJ-17\n资料归档",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-18",
"displayname": "AJ-18\n预警评估及发布",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-19",
"displayname": "AJ-19\n预警报告",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-20",
"displayname": "AJ-20\n预警告知",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-21",
"displayname": "AJ-21\n预警管控实施",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-22",
"displayname": "AJ-22\n预警解除",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-23",
"displayname": "AJ-23\n预警管控评价",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "AJ-4",
"displayname": "AJ-4\n物资采购",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-3",
"displayname": "WZ-3\n超市化物资采购需求",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-5",
"displayname": "WZ-5\n物资（服务）招标/采购文件内容",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-6",
"displayname": "WZ-6\n物资（服务）发标/邀请",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-33",
"displayname": "WZ-33\n评标专家使用与维护",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-34",
"displayname": "WZ-34\n评标专家资格终止",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-35",
"displayname": "WZ-35\n评标专家评价",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "RZ-21",
"displayname": "RZ-21\n*一线员工绩效确定",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "RZ-25",
"displayname": "RZ-25\n发放员工薪酬",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "CW-103",
"displayname": "CW-103\n负债类科目核算",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "CW-76",
"displayname": "CW-76\n内部资金流转",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "CW-75",
"displayname": "CW-75\n银行对账",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-1",
"displayname": "YJ-1\n设备移交",
"category": "辅助保障",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-2",
"displayname": "YJ-2\n设备巡视",
"category": "资源保障",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-3",
"displayname": "YJ-3\n设备检测",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-4",
"displayname": "YJ-4\n设备维护",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-5",
"displayname": "YJ-5\n状态评价",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "DK-10",
"displayname": "DK-10\n确定年度/月度电力平衡需求",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "DK-12",
"displayname": "DK-12\n确定电能平衡计划",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "DK-11",
"displayname": "DK-11\n确定日电能平衡需求",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-6",
"displayname": "YJ-6\n检修准备",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-7",
"displayname": "YJ-7\n检修实施",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "YJ-8",
"displayname": "YJ-8\n恢复运行",
"category": "电网业务",
"draggable": true,
"isleaf": false
}, {
"name": "WZ-22",
"displayname": "WZ-22\n物资实际拆旧管理",
"category": "电网业务",
"draggable": true,
"isleaf": false
}],
links: [{
"source": "AJ-10",
"target": "AJ-11",
"value": "后置"
}, {
"source": "AJ-11",
"target": "AJ-12",
"value": "后置"
}, {
"source": "AJ-12",
"target": "AJ-13",
"value": "后置"
}, {
"source": "AJ-13",
"target": "AJ-14",
"value": "后置"
}, {
"source": "AJ-14",
"target": "AJ-15",
"value": "后置"
}, {
"source": "AJ-15",
"target": "AJ-16",
"value": "后置"
}, {
"source": "AJ-16",
"target": "AJ-17",
"value": "后置"
}, {
"source": "AJ-18",
"target": "AJ-19",
"value": "后置"
}, {
"source": "AJ-19",
"target": "AJ-20",
"value": "后置"
}, {
"source": "AJ-20",
"target": "AJ-21",
"value": "后置"
}, {
"source": "AJ-21",
"target": "AJ-22",
"value": "后置"
}, {
"source": "AJ-22",
"target": "AJ-23",
"value": "后置"
}, {
"source": "AJ-4",
"target": "WZ-3",
"value": "引用"
}, {
"source": "WZ-3",
"target": "WZ-5",
"value": "后置"
}, {
"source": "WZ-5",
"target": "WZ-6",
"value": "后置"
}, {
"source": "WZ-6",
"target": "WZ-33",
"value": "后置"
}, {
"source": "WZ-33",
"target": "WZ-34",
"value": "后置"
}, {
"source": "WZ-33",
"target": "WZ-35",
"value": "后置"
}, {
"source": "WZ-35",
"target": "RZ-21",
"value": "后置"
}, {
"source": "RZ-21",
"target": "RZ-25",
"value": "后置"
}, {
"source": "RZ-25",
"target": "CW-103",
"value": "后置"
}, {
"source": "CW-103",
"target": "CW-76",
"value": "后置"
}, {
"source": "CW-76",
"target": "CW-75",
"value": "后置"
}, {
"source": "CW-103",
"target": "CW-77",
"value": "后置"
}, {
"source": "CW-77",
"target": "CW-75",
"value": "后置"
}, {
"source": "YJ-1",
"target": "YJ-2",
"value": "后置"
}, {
"source": "YJ-2",
"target": "YJ-3",
"value": "后置"
}, {
"source": "YJ-3",
"target": "YJ-4",
"value": "后置"
}, {
"source": "YJ-4",
"target": "YJ-5",
"value": "后置"
}, {
"source": "YJ-5",
"target": "DK-10",
"value": "后置"
}, {
"source": "DK-10",
"target": "DK-12",
"value": "后置"
}, {
"source": "YJ-5",
"target": "DK-11",
"value": "后置"
}, {
"source": "DK-11",
"target": "DK-12",
"value": "后置"
}, {
"source": "YJ-5",
"target": "YJ-6",
"value": "后置"
}, {
"source": "YJ-6",
"target": "YJ-7",
"value": "后置"
}, {
"source": "YJ-7",
"target": "YJ-8",
"value": "后置"
}, {
"source": "YJ-8",
"target": "WZ-22",
"value": "引用"
}, {
"source": "WZ-22",
"target": "CW-54",
"value": "后置"
}],
categories: [{
"name": "辅助保障"
}, {
"name": "资源保障"
}, {
"name": "电网业务"
}],
draggable: true,
focusNodeAdjacency: true,
roam: true,
label: {
normal: {
show: true,
formatter: function(e) {
return (e.data.displayname);
},
textStyle: {
color: '#333',
fontFamily: '微软雅黑',
fontSize: 5
}
}
},
lineStyle: {
normal: {
curveness: 0
},
emphasis: {
color: 'yellow',
curveness: 0,
width: 2
}
}
}]
};
截图如下
