在angular项目中使用echarts画了一个流程图,如图
六边形和序号为两个重合的节点,光标悬浮的时候,六边形节点的层级会自动提高导致覆盖序号节点,如图
代码中并没有设置光标悬浮,并且尝试一些查到的改变层级zlevel,z等都无效,怎样才能让序号节点始终在最上面,或者怎样可以设置节点光标悬浮时无任何动作。
angular版本为11.2.0,echarts一开始为4.4.0,现升级为5.4.1 均无效
部分代码如下:
class="echart" echarts (chartInit)="chartInit($event)" #Histogram [options]="options">div>
nodes = [
{
id:'t1',name: '11', value: [100, 1950],content:'hahhahahah',
symbolSize: [200, 80],
itemStyle:{color:'blue',borderColor: 'blue',},label:{color:'#fff'}
},
{ id:'t2', name: '22', value: [450, 1950],symbolSize: [300, 60]},
{ id:'t3',name: '33', value: [830, 1950],symbolSize: [300, 60],},
{ id:'t4',name: '44', value: [782, 650],symbolSize: [400, 60],},
{ id:'t5',name: this.nodeTitle.t4, value: [410, 650],symbolSize: [300, 60],},
{ id:'t6',name: '55', value: [80, 650],itemStyle:{color:'#C00000',borderColor: '#C00000',},label:{color:'#fff'},symbolSize: [300, 60],},
{ name: '1', value: [380, 1950],symbol:'circle',symbolSize: [30, 30],itemStyle:{color:'#D7091D'},label:{color:'#fff'}},
{ name: '2', value: [740, 1950],symbol:'circle',symbolSize: [30, 30],itemStyle:{color:'#F76F20'},label:{color:'#fff'}},
{ name: '3', value: [652, 650],symbol:'circle',symbolSize: [30, 30],itemStyle:{color:'#FFAF00'},label:{color:'#fff'}},
{ name: '4', value: [320, 650],symbol:'circle',symbolSize: [30, 30],itemStyle:{color:'#57BC7F'},label:{color:'#fff'}},
{ name: '5', value: [-10, 650],symbol:'circle',symbolSize: [30, 30],itemStyle:{color:'#2DBBCE'},label:{color:'#fff'}},
]
options = {
tooltip:{
show:false,
trigger: 'none'
},
backgroundColor: "#f4f4f4",
xAxis: {
min: 0,
max: 1000,
show: false,
type: 'value'
},
yAxis: {
min: 0,
max: 2000,
show: false,
type: 'value'
},
series: [
{
type: 'graph',
coordinateSystem: "cartesian2d",
layout: 'force',
symbol:'path://M319.0784 0h2750.498133a102.4 102.4 0 0 1 89.9072 53.4016l226.7648 416.0512a102.4 102.4 0 0 1-0.580266 99.072L3159.722667 971.656533A102.4 102.4 0 0 1 3070.395733 1024H318.907733a102.4 102.4 0 0 1-91.562666-56.541867L22.869333 559.3088a102.4 102.4 0 0 1-0.1024-91.477333l204.629334-411.067734A102.4 102.4 0 0 1 319.044267 0z',
data: this.nodes,
links: this.links,
itemStyle: {
normal:{
color: "#fff",
borderColor: '#454545',
borderWidth: 1,
}
},
lineStyle: {
normal: {
width: 2,
color: '#454545',
// curveness: 0,
}
},
label: {
show: true,
color: '#333',
fontSize:'20',
fontWeight:'600',
},
},
]
}