markLine 标示线的使用
markLine 可以单独写在一个对象里,也可以接在其它数据下面,如果将 markLine 单独写在一个对象里,就必须加 type ,不然报错。
markLine 的 data 和其它 data 一样,也可以单独设置样式。
markLine 可以在 X 轴上,也可以在 Y 轴上 (竖向、横向)。
symbol 的几种样式 :默认["circle","arrow"]。circle圆 | rect长方 | roundRect圆长方 | triangle三角 | diamond菱形 | pin大头针 | arrow箭头 | none没有
series: [ { name: "监测数据", type: "line", smooth: true, // 是否平滑,布尔类型/数字类型0~1,true = 0.5 data: [] }, { type: "line", // 如果将 markLine 单独写在一个对象里,就必须加 type ,不然报错。 markLine: { symbol: "none", // 相当于["none", "none"] [虚线,没有箭头] silent: true, // true 不响应鼠标事件 data: [ { xAxis: "sun" // 对于x轴中的一个值 } ], label: { show: true, // 是否展示文字 color: "red", fontSize: 20, formatter: function () { return "想展示的话" } }, lineStyle: { color: "red", width: 1, // 0 的时候可以隐藏线 type: "solid" // 实线,不写默认虚线 } } }, { type: "line", markLine: { // 样式可以单独设置,也可以一起设置 symbol: "none", silent: true, // 鼠标移上是否有响应(线变粗) data: [ { yAxis: "20", //type: "min/max/average" // 特殊的标注类型,用于标注最大值最小值等。 lineStyle: { // 线的样式 color: "#77D048", width: 1, opacity: 0.8 }, label: { // 文字的样式,默认是白色,有时候文字不显示,可能是颜色的问题 color: "#77D048" } }, { yAxis: "40", lineStyle: { // 线的样式 color: "#EFCA2A", width: 1, opacity: 0.8 }, label: { // 文字的样式,默认是白色,有时候文字不显示,可能是颜色的问题 color: "#EFCA2A" } } ], label: { // 样式也可以统一设置 padding: [-13, -40, 0, 0], formatter: function (params) { return `${params.value}` } } } } ]
隐藏 markLine:
lineStyle.width = 0, label.show = false 时可以隐藏 markLine 。