echarts 标记线markLine的使用

逆风优雅 2022-08-06 08:18:25 阅读数:335

使用Echarts标记markline

效果图:  在某个值处添加一条分割线

markLine写在 serise中

 series: [
{
data: hl_YData,
type: 'bar',
barWidth: 40,
itemStyle: {
normal: {
// 定制显示(按顺序)
color: function (params) {
var colorList = ['#97D7DB', '#97D7DB', '#EAE88A', '#EAE88A', '#F7782C', '#F7782C',];
return colorList[params.dataIndex]
},
barBorderRadius: [10, 10, 0, 0],
},
},
},
{
type: 'bar',
markLine: {
silent: true, // 鼠标移动到标记线上无操作
symbol: "none",
itemStyle: {
normal: {
lineStyle: {
color: '#ff0000',
}
}
},
label: {
position: 'end', // 表现内容展示的位置
formatter: markLineData=='0'?'':'异常阻抗分界线', // 标线展示的内容
color: '#8C8C8C' // 展示内容颜色
},
data: [
{
xAxis: '150-200' // 分割线的位置
}
]
//分割线也可以这样设置
//data: [
// // [4,18] 第一个参数是x轴的index,第二个是y轴的最大值
// [ {
// coord: [4, markLineData]
// },
// ],
//
// ]
}
}
]

版权声明:本文为[逆风优雅]所创,转载请带上原文链接,感谢。 https://blog.csdn.net/qq_44603011/article/details/126157175