码迷,mamicode.com
首页 > 其他好文 > 详细

Echart--折线图

时间:2018-03-02 14:41:38      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:img   ott   com   提示   art   离职   折线   tom   value   

效果图:

技术分享图片

设置数据:

option1: {
          title: {
            text: ‘入离职统计‘
          },
          tooltip: {//提示框组件,default:‘item‘,还有axis,none
            trigger: ‘axis‘
          },
          legend: {
            data: [‘入职‘, ‘离职‘]//显示条
          },
          grid: {
            left: ‘3%‘,
            right: ‘4%‘,
            bottom: ‘3%‘,
            containLabel: true
          },
          toolbox: {
            feature: {
              saveAsImage: {},保存为png图片
              magicType: {//切换图表显示类型
                type: [‘line‘, ‘bar‘, ‘stack‘, ‘tiled‘]
              }
            }
          },
          xAxis: {
            type: ‘category‘,
            boundaryGap: false,
            data: [‘1月‘, ‘2月‘, ‘3月‘, ‘4月‘, ‘5月‘, ‘6月‘, ‘7月‘]
          },
          yAxis: {
            type: ‘value‘
          },
          series: [
            {
              itemStyle: {normal: {label: {show: true}}},
              name: ‘入职‘,
              type: ‘line‘,//设置图表类型
              // stack: ‘总量‘,
              data: [12, 13, 10, 13, 9, 23, 21]
            },
            {
              itemStyle: {normal: {label: {show: true}}},
              name: ‘离职‘,
              type: ‘line‘,
              // stack: ‘总量‘,
              data: [2, 1, 4, 8, 10, 4, 6]
            }
          ]
        }

  

 

Echart--折线图

标签:img   ott   com   提示   art   离职   折线   tom   value   

原文地址:https://www.cnblogs.com/LWJ-booke/p/8492398.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!