echarts click配置项内容和展示
配置项如下
option = {
"tooltip": {
"trigger": "item",
"triggerOn": "mousemove"
},
"series": {
"type": "sankey",
"layout": "none",
"top": "12px",
"bottom": "4px",
"right": "72px",
"left": "left",
"draggable": false,
nodeWidth: 5,
nodeGap: 1,
"containLabel": {
"show": true
},
label:{
fontSize: 10
},
"data": [{
"name": "研发大厅",
"itemStyle": {
"color": "#DECBE4",
"opacity": 0.8
}
}, {
"name": "经理室",
"itemStyle": {
"color": "#DECBE4",
"opacity": 0.8
}
}, {
"name": "洽谈室",
"itemStyle": {
"color": "#CCEBC5",
"opacity": 0.8
}
}, {
"name": "实验室",
"itemStyle": {
"color": "#B3CDE3",
"opacity": 0.8
}
}, {
"name": "研发部",
"itemStyle": {
"color": "#FBB4AE",
"opacity": 0.8
}
}, {
"name": "生产车间",
"itemStyle": {
"color": "#269FFF",
"opacity": 0.8
}
}, {
"name": "生产部",
"itemStyle": {
"color": "#637CFF",
"opacity": 0.8
}
}, {
"name": "工程部",
"itemStyle": {
"color": "#F56828",
"opacity": 0.8
}
}, {
"name": "会议室",
"itemStyle": {
"color": "#5A77FA",
"opacity": 0.8
}
}, {
"name": "综合办",
"itemStyle": {
"color": "#18AADE",
"opacity": 0.8
}
}, {
"name": "电力",
"itemStyle": {
"color": "#6565ff",
"opacity": 0.8
}
}, {
"name": "水类",
"itemStyle": {
"color": "#ff6d6d",
"opacity": 0.8
}
}, {
"name": "办公",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "照明",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "照明-研发部",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-研发大厅",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-研发大厅",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-经理室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-经理室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-洽谈室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-实验室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-实验室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "商务部",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "仓库",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "生产二线",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "生产三线",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "维修线",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "生产一线",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "照明-生产车间",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "屏柜生产车间",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-生产车间",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-生产车间",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "CPH生产线",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "老化房",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "电梯",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-工程部",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "照明-工程部照明",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "外贸部",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "综合管理部",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-综合办",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-综合办会议室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "空调-综合办会议室",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "照明-综合办",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "办公-综合办",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "公共区域",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "渠道部",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "1级损耗",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "2级损耗",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "3级损耗",
"itemStyle": {
"opacity": 0.8
}
}, {
"name": "损耗",
"itemStyle": {
"opacity": 0.8
}
}],
"links": [{
"source": "水类",
"target": "研发部",
"value": "0.00",
"lineStyle": {
"color": "#ff6d6d"
}
}, {
"source": "工程部",
"target": "照明-工程部照明",
"value": "2.29",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "工程部",
"target": "办公-工程部",
"value": "0.29",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发部",
"target": "照明-研发部",
"value": "1.98",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "经理室",
"target": "办公-经理室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "经理室",
"target": "空调-经理室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "洽谈室",
"target": "空调-洽谈室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发大厅",
"target": "办公-研发大厅",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发大厅",
"target": "空调-研发大厅",
"value": "0.60",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "实验室",
"target": "空调-实验室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "实验室",
"target": "办公-实验室",
"value": "6.97",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发部",
"target": "经理室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发部",
"target": "洽谈室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发部",
"target": "研发大厅",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "研发部",
"target": "实验室",
"value": "6.97",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产部",
"target": "生产车间",
"value": "10.70",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "屏柜生产车间",
"value": "0.10",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "老化房",
"value": "1.89",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "办公-生产车间",
"value": "0.31",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "空调-生产车间",
"value": "0.38",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "维修线",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "生产一线",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "生产三线",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "照明-生产车间",
"value": "5.45",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "生产二线",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产车间",
"target": "CPH生产线",
"value": "2.57",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产部",
"target": "电梯",
"value": "0.57",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产部",
"target": "仓库",
"value": "1.35",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "综合办",
"target": "会议室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "会议室",
"target": "办公-综合办会议室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "会议室",
"target": "空调-综合办会议室",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "综合办",
"target": "空调-综合办",
"value": "0.18",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "综合办",
"target": "办公-综合办",
"value": 0,
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "综合办",
"target": "照明-综合办",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "水类",
"target": "工程部",
"value": "0.00",
"lineStyle": {
"color": "#ff6d6d"
}
}, {
"source": "水类",
"target": "综合办",
"value": "0.00",
"lineStyle": {
"color": "#ff6d6d"
}
}, {
"source": "水类",
"target": "生产部",
"value": "0.00",
"lineStyle": {
"color": "#ff6d6d"
}
}, {
"source": "电力",
"target": "工程部",
"value": "2.58",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "渠道部",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "外贸部",
"value": "0.21",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "综合管理部",
"value": "8.28",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "公共区域",
"value": "0.80",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "研发部",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "生产部",
"value": "12.62",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "商务部",
"value": "0.35",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "综合办",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "电力",
"target": "1级损耗",
"value": "16.59",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "2级损耗",
"target": "3级损耗",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "2级损耗",
"target": "3级损耗",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "水类",
"target": "1级损耗",
"value": "0.00",
"lineStyle": {
"color": "#ff6d6d"
}
}, {
"source": "1级损耗",
"target": "2级损耗",
"value": "7.64",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "2级损耗",
"target": "3级损耗",
"value": "7.04",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "3级损耗",
"target": "损耗",
"value": "7.64",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "1级损耗",
"target": "损耗",
"value": "0.00",
"lineStyle": {
"color": "#ff6d6d"
}
}, {
"source": "电梯",
"target": "办公",
"value": "0.57",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-经理室",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-工程部",
"target": "办公",
"value": "0.29",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-研发大厅",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-生产车间",
"target": "办公",
"value": "0.38",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "照明-生产车间",
"target": "办公",
"value": "5.45",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-综合办",
"target": "办公",
"value": 0,
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "公共区域",
"target": "办公",
"value": "0.80",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "屏柜生产车间",
"target": "办公",
"value": "0.10",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "老化房",
"target": "办公",
"value": "1.89",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-实验室",
"target": "办公",
"value": "6.97",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-综合办会议室",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "办公-生产车间",
"target": "办公",
"value": "0.31",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "维修线",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产一线",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产三线",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "生产二线",
"target": "办公",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "CPH生产线",
"target": "办公",
"value": "2.57",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "照明-工程部照明",
"target": "照明",
"value": "2.29",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "照明-研发部",
"target": "照明",
"value": "1.98",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "渠道部",
"target": "照明",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "仓库",
"target": "照明",
"value": "1.35",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "外贸部",
"target": "照明",
"value": "0.21",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "综合管理部",
"target": "照明",
"value": "8.28",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "照明-综合办",
"target": "照明",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "商务部",
"target": "照明",
"value": "0.35",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-综合办",
"target": "空调",
"value": "0.18",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-实验室",
"target": "空调",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-洽谈室",
"target": "空调",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-经理室",
"target": "空调",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-研发大厅",
"target": "空调",
"value": "0.60",
"lineStyle": {
"color": "#6565ff"
}
}, {
"source": "空调-综合办会议室",
"target": "空调",
"value": "0.00",
"lineStyle": {
"color": "#6565ff"
}
}],
"curveness": 0.5,
"layoutIterations": 0,
"nodeGap": 20
}
}
myChart.on('click', (param) => {
console.log(param)
})
//鼠标右键
myChart.getZr().on('contextmenu', (param) => {
console.log(param)
});
截图如下
