<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="/Areas/ReplayPC/Content/Script/jquery-1.9.1.min.js"></script>
    <script src="/Areas/JianMoPC/Scripts/echarts.min.js"></script>
</head>
<body>
    <div id="main" style="width: 600px;height:400px;"></div>
</body>
</html>
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));
    var quxianoption = {
        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]
            }
        ]
    };
    myChart.setOption(quxianoption);
</script>

echarts 实例demo 详细讲解的更多相关文章

  1. Spring+EhCache缓存实例（详细讲解+源码下载）(转)

    一.ehcahe的介绍 EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernate中默认的CacheProvider.Ehcache是一种广泛使用的开源Java分布式 ...

  2. Spring+EhCache缓存实例（详细讲解+源码下载）

    一.ehcahe的介绍 EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernate中默认的CacheProvider.Ehcache是一种广泛使用的开源Java分布式 ...

  3. 第二十三节：Java语言基础-详细讲解函数与数组

    函数 函数在Java中称为方法,在其他语言中可能称为函数,函数,方法就是定义在类中具有特定功能的程序.函数,在Java中可称为方法. 函数的格式: 修饰符 返回值类型 函数名(参数类型 参数1, 参数 ...

  4. 30 道 Vue 面试题，内含详细讲解（涵盖入门到精通，自测 Vue 掌握程度）

    前言 本文以前端面试官的角度出发,对 Vue 框架中一些重要的特性.框架的原理以问题的形式进行整理汇总,意在帮助作者及读者自测下 Vue 掌握的程度.本文章节结构以从易到难进行组织,建议读者按章节顺序 ...

  5. 详细讲解nodejs中使用socket的私聊的方式

    详细讲解nodejs中使用socket的私聊的方式 在上一次我使用nodejs+express+socketio+mysql搭建聊天室,这基本上就是从socket.io的官网上的一份教程式复制学习,然 ...

  6. iOS KVC详细讲解

    iOS KVC详细讲解 什么是KVC? KVC即NSKeyValueCoding,就是键-值编码的意思.一个非正式的 Protocol,是一种间接访问对象的属性使用字符串来标识属性,而不是通过调用存取 ...

  7. [iOS]数据库第三方框架FMDB详细讲解

    [iOS]数据库第三方框架FMDB详细讲解 初识FMDB iOS中原生的SQLite API在进行数据存储的时候,需要使用C语言中的函数,操作比较麻烦.于是,就出现了一系列将SQLite API进行封 ...

  8. jquery插件分类与编写详细讲解

    jquery插件分类与编写详细讲解 1. 插件种类 插件其实就是对现有的方法(或者叫函数)做一个封装,方便重用提高开发效率.   jQeury主要有2种类型   1)实例对象方法插件 开发能让所有的j ...

  9. node+vue进阶【课程学习系统项目实战详细讲解】打通前后端全栈开发(1)：创建项目，完成登录功能

    第一章 建议学习时间8小时·分两次学习      总项目预计10章 学习方式:详细阅读,并手动实现相关代码(如果没有node和vue基础,请学习前面的vue和node基础博客[共10章]) 视频教程地 ...

随机推荐

  1. windows 平台使用wireshark命令行抓包

    Windows网络流量大,或则需要长时间抓包时,wireshark图形界面使用起来比较麻烦 wireshark 内置 dumpcap命令 Capture interface:  -i <inte ...

  2. SpringMVC Ueditor1.4.3 未找到上传数据

    ueditor自事的fileupload组件与spring的有冲突.将那个类BinaryUploader 重写就可以了             return storageState;         ...

  3. java . 请在小于99999的正整数中找符合下列条件的数，它既是完全平方数，又有两位数字相同，如：144，676。

    import java.util.HashMap; import java.util.Map; import java.util.Map.Entry; //请在小于99999的正整数中找符合下列条件的 ...

  4. sqlite中常见的问题总结

    一.sqlite中不能使用日期进行相减,执行结果无效 例如:SELECT count(*) as cnt FROM DayBanalces WHERE (date(ofDay)- date('2013 ...

  5. spring配置文件加密

    原文:http://www.open-open.com/code/view/1453520072183 spring框架在一些对安全性要求较高的生产环境下,配置文件不允许出现明文用户名密码配置,如数据 ...

  6. Java二维码的解码和编码

    原文:http://www.open-open.com/code/view/1430906793866 import java.io.File; import java.util.Hashtable; ...

  7. Spring Security教程（5）---- 国际化配置及UserCache

    这一章是为了给后面的讲解打基础的,主要介绍下国际化的配置及UserCache的配置及使用 国际化配置 <!-- 定义上下文返回的消息的国际化 --> <bean id="m ...

  8. 【c++】拷贝控制具体分析

    我们可以定义拷贝操作,使类的行为看起来像一个值或者像一个指针,这取决于如何拷贝指针成员. 当我们拷贝一个像值的对象时,副本和原对象是完全独立的,改变副本不会对原对象有任何影响,反之亦然.标准库容器和s ...

  9. VMware虚拟机上安装linux和克隆

    虚拟机上安装好一台linux 系统后.为了高速搭建hadoop集群.须要再安装几个linux系统,比較笨的办法能够又一次用ios 镜像文件进行安装.可是又一次安装须要又一次配置一些信息并且安装时间比較 ...

  10. 【转】PLSQL_标准删除的方式Delete/Drop/Truncate区别和比较