option = {
title: {
text: '折线图堆叠'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:['邮件营销','联盟广告','视频广告','直接访问','搜索引擎']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一','周二','周三','周四','周五','周六','周日']
},
yAxis: {
type: 'value'
},
series: [
{
name:'邮件营销',
type:'line',
stack: '总量',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'联盟广告',
type:'line',
stack: '总量',
data:[220, 182, 191, 234, 290, 330, 310]
},
{
name:'视频广告',
type:'line',
stack: '总量',
data:[150, 232, 201, 154, 190, 330, 410]
},
{
name:'直接访问',
type:'line',
stack: '总量',
data:[320, 332, 301, 334, 390, 330, 320]
},
{
name:'搜索引擎',
type:'line',
stack: '总量',
data:[820, 932, 901, 934, 1290, 1330, 1320]
}
]
};

echarts 堆叠折线的更多相关文章

  1. Echarts自定义折线图例,增加选中功能

    用Echarts图表开发,原本的Echarts图例不一定能满足我们的视觉要求. 下面是Echarts 折线图自定义图例,图例checked选中,相应的折线线条会随之checked,其余未选中的图例对应 ...

  2. Echarts案例-折线图

    一:先在官网下载 https://www.echartsjs.com/zh/download.html 然后再建立工程,导入这两个包: 写代码: <!DOCTYPE html> <h ...

  3. echarts版本折线图

    1.效果如下:         绘制折线图,应该算是说echarts中使用最简单也算使用频率最高的一种功能了吧.根据官网列子能找出规律,只是有些属性对于初接触者来说,会有点陌生,不过仔细阅读一下还是不 ...

  4. Echarts line折线图使用(vue)

    实现 首先引入echarts工具 // vue文件中引入echarts工具 let echarts = require('echarts/lib/echarts') require('echarts/ ...

  5. echarts堆叠图添加总量

    echarts在使用中往往会遇到需要展示总量信息的情况,比较典型的就是3维统计的堆叠柱状图 堆叠是在柱状图的基础上,给几项设置同一stack来实现的.不考虑在tips中实现总和,有两种方式可以实现总和 ...

  6. ECharts使用—折线图动态加载

    最近需求中用到折线图,单线条,多线交错,之前是散点图,用的是另一个 amcharts.js,这个文档也能找的到,回归早本次重点:ECharts 一.首先引入echarts.common.min.js文 ...

  7. echarts之折线图配置(附带图例很多做成分页效果)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  8. 移动端引用echarts的折线图

          移动端写一个图表引用echarts,highcharts插件,本次要找一个能够显示最新数据的折线图,最后只找到显示最大值: 找到echarts的实例:记一下个各功能.   <!DOC ...

  9. echarts实现折线图

    前端框架使用的angular,折线图使用echarts实现. 这里实现的折线图只是简单是折线图,折线图显示在table中,不需要xy轴的数据说明. 1. item.component.html < ...

随机推荐

  1. ZOJ 2850和ZOJ 1414

    下午上数据结构,结果竟然没有新题.T T果断上OJ来水一发 ZOJ 2850   Beautiful Meadow 传送门http://acm.zju.edu.cn/onlinejudge/showP ...

  2. struts2漏洞原理及解决的方法

    1.原理 Struts2的核心是使用的webwork框架,处理 action时通过调用底层的getter/setter方法来处理http的參数,它将每一个http參数声明为一个ONGL(这里是ONGL ...

  3. Android ViewGroup使用小结

    ViewGroup定义 在api中是这么描写叙述ViewGroup的:A ViewGroup is a special view that can contain other views. 依据意思我 ...

  4. MySQL数据导出导入任务脚本

    #!/usr/bin/env python#-*- encoding: utf8 -*- import timeimport osimport mysql.connector #定义一些全局变量  w ...

  5. 17、MJPG编码和AVI封装

    一.JPEG和MJPG编码介绍 1.JPEG编码 我个人简单的理解是,JPEG即是Joint Photographic Experts Group(联合图像专家组)的缩写,更是一种图像压缩编码算法.J ...

  6. 15、USB摄像头图片采集+QT显示

    一.Qt的下载和的安装 关于Qt的安装,网络上有很详细的介绍.这里只做简单介绍. 需要的安装包一共有两个:Qt Creator 和QTE. 1)QT Creator 下载地址:qt-sdk-linux ...

  7. angular的学习参考材料

    原文地址:https://www.jianshu.com/p/b9db7bb3d4ec 目的 其实写这篇文章的主要目的是为了提供给那些刚刚入门angular或者有意学习angular的读者准备的. 我 ...

  8. ActiveMQ简单入门实例

    一.下载MQ 官方网站下载:http://activemq.apache.org/ 我用的是 apache-activemq-5.15.0-bin 二.安装 我用的是64位所以双击 apache-ac ...

  9. jsp页面无法解析EL表达式问题

    Servlet版本的问题.原来Servlet中可以设定是否解析EL表达式,只有2.4版本的Servlet默认是解析EL表达式的,而其他版本是默认不解析EL表达式.于是把web.xml中使用的2.5版本 ...

  10. 异步FIFO总结

    异步FIFO总结 异步FIFO的基本概念 异步FIFO读写分别采用相互异步的不同时钟,使用异步FIFO可以在两个不同时钟系统之间快速而方便地传输实时数据 FIFO的常见参数 FIFO的宽度:即FIFO ...