关于echarts:echarts折线图配置

echarts折线图配置

1.开发环境 vue+element+echarts
2.电脑系统 windows10专业版
3.在开发的过程中,咱们常常会应用到 echarts的折线图,依据我的项目,总会有各种奇葩的需要,要实现的成果如下:

4.我的项目要求,y轴只能显示三个值,两头的显示的值是 下面的值+上面的值/2,怎么实现这个成果呢?代码如下:

let Chente: any = {
        grid: {
        left: '0%',
        right: '4%',
        // bottom: '-3%',
        containLabel: true
    },
        tooltip: {
        trigger: 'axis'
    },
        xAxis: {
        type: 'category',
        data: ['', '', '', '', '', '', '','', '', '', '', '', '', '','', '', '', '', '', '', '','', '', '', '', '', '', ''],
        show:false
    },
    yAxis: {
        type: 'value',
        max:Chentemax,
        min:Chentemin,
        interval:MAI, //设置两头值,
        axisLabel: {
                            show: true,
                            textStyle: {
                                color: '#ffffff',
                                fontWeight:900,
                                fontSize:18
                            }
                        }
    },
    series: [{
        // data: [820, 932, 901, 934, 1290, 1330, 1320],
        data:ChenteArr,
        type: 'line'
    }]
      };

//这个是通过传参的办法,实现的
5.本期的教程到了这里就完结啦,是不是很简略!让咱们一起致力走向巅峰!

评论

发表回复

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

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理