<!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. POJ 2192 【DP】

    题意: 给三个字符串,判断前两个在相对顺序不变的情况下是否可以组成第三个字符串. 思路: 先说屌丝: dp[i][j]代表1串的前i个和2串的前j个字符在3串的前i+j个字符中最多能够组合出几个字符. ...

  2. JAVA_构造方法

    构造方法: 作用:是给对象的数据进行初始化用的. 特点:1 必须和类的名字一样. 2 和真正的方法是有所不同的,构造方法是没有返回值的类型的 eg:   方法:public  void  User ( ...

  3. Java实验--统计字母出现频率及其单词个数

    本周的实验要求在之前实现统计单词的基础之上(可以见之前博客的统计单词的那个实验),对其进行修改成所需要的格式,统计字母出现频率的功能,并按照一定的格式把最终结果的用特定的格式在文本中显示出来 统计过程 ...

  4. neo4j在linux下的安装

    1. Neo4j简介 Neo4j是一个用Java实现的.高性能的.NoSQL图形数据库.Neo4j 使用图(graph)相关的概念来描述数据模型,通过图中的节点和节点的关系来建模.Neo4j完全兼容A ...

  5. FIREDAC保存ORACLE的BLOB字段数据

     FIREDAC默认识别ORACLE的BLOB字段为HUGEBLOB,需要将HBLOB映射为BLOB,才可以保存ORACLE的BLOB字段的数据.

  6. GreenDao数据库的升级

    应用使用了GreenDao数据库,在版本升级的时候需要更改dao的字段,新增.修改.删除字段操作,如果直接删除原来的表的话那用户原来的一些数据就没有了,所以在更新数据库的时候需要做一次封装,把原来的数 ...

  7. 拷贝地图 CopyAndOverwriteMap()

    private void CopyAndOverwriteMap() { //Get IObjectCopy interface IObjectCopy objectCopy = new Object ...

  8. 我的Android Studio 优化之路

    改动keymap 改动经常使用的快捷键 代码补全(Eclipse: ALT+/) Android Studio中默认用的是Ctrl+Space, 这跟输入法切换冲突.找到Keymap->Main ...

  9. simple-todo: 一个简易的 todo 程序 - django版

    今天无意间看到  simple-todo: 一个简易的 todo 程序 - web.py 中文教程 ,然后发现竟然有好多的版本 http://simple-is-better.com/news/tag ...

  10. Spring4.0MVC学习资料,注解自己主动扫描bean,自己主动注入bean(二)

    Spring4.0的新特性我们在上一章已经介绍过了. 包含它对jdk8的支持,Groovy Bean Definition DSL的支持.核心容器功能的改进,Web开发改进.測试框架改进等等.这张我们 ...