series里面添加markLine

    const echart = () =>{
     var xData=["xxx","xxx","xxx","xxx","xxx","xxx","xxx","xxx,"xxx","xxx","xxx"],
          serieData=[10, 30, 20, 30, 80, 20, 10,30,30,20,30,20],
          marks=[20];
      let myEcharts = echarts.init(document.getElementById("hdechart7"))
      myEcharts.setOption({
        grid: {
          top:"15%",
          left: '3%',
          right: '8%',
          bottom: '3%',
          containLabel: true
        },
        xAxis : [
          {
            type : 'category',
            data :xData,
            axisTick: {
              show:false,
              alignWithLabel: true
            },
            axisLabel: {
              textStyle: {
                color: '#fff',
                fontWeight: 'normal',
                fontSize: '12',
              },
              interval: 0,
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#456980 ',
              }
            },

          }
        ],
        yAxis: {
          name: "xxx",
          nameTextStyle: {
            color: "#fff",
            fontSize:".12rem"
          },
          type: 'value',
          axisTick: {
            alignWithLabel: true,
          },
          axisLine: {
            show: true,
            lineStyle: {
              color: '#456980',
            }
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: '#456980',
            }
          },
          axisLabel: {
            textStyle: {
              color: '#fff',
              fontWeight: 'normal',
              fontSize: '12',
            },
          }
        },
        series : [
          {
            name:'',
            type:'bar',
            barWidth: '18',
            data:serieData,
            label: {
              normal: {
                show: true,
                position: 'top',
                formatter: '{c}',
                textStyle: {
                  color: '#fff',
                  fontWeight: 'normal',
                  fontSize: '12',
                },
              }
            },
            itemStyle: {
              normal: {
                show: true,
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                  offset: 0,
                  color: 'rgba(49, 200,190, 0.8)'
                }, {
                  offset: 1,
                  color: 'rgba(16, 127,159, 0.8)'
                }]),
                shadowColor: 'rgba(0, 0, 0, 0.1)',
                shadowBlur: 10
              }
            },
            //标记的线1
            markLine: {
              symbol:['circle', 'arrow'], //箭头
              silent: true,
              lineStyle: {
                type: 'dashed'
              },
              data: [
                {
                  yAxis:marks,
                  lineStyle: {
                    width: 1.656,
                    color: '#00ff00'
                  },
                  label: {
                    show: true,
                    color: '#00ff00',
                    fontSize: '14',
                  }
                }

              ]
            },
          },

        ],

      });
      window.addEventListener("resize", function () {
        myEcharts.resize();
      });
    }

在这里插入图片描述

原文地址:https://blog.csdn.net/buzhidjiaosha/article/details/128480269

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_17773.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注