<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Echarts图表</title>
<script src="../js/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width:600px;height:400px;"></div>
</body>
</html>
<script>
var myChart=echarts.init(document.getElementById('main'))
var option={
legend:{
padding:10,
itemGap:10,//图例间隔
data:['邓艳波','杨国娥']//legend的data值要和series的对象的每个name 值相对应,不然不出来lenend
},
tooltip:{//悬浮的时候提示框
trigger:'item'//触发方式
},
xAxis:{
type:'category',//什么类型的,比如数值?
data:['周一','周二','周三','周四','周五','周六','周日']
},
yAxis:{
type:'value',
boundaryGap:[0.1,0.1],//类目起始和结束两端空白策略,见下图,默认为true留空,false则顶头
splitNumber:4,//数值的分割段数,不指定的时候根据最大值最小值进行划分 },
series:[
{
name:'邓艳波',//系列名如启用legend,该值将被legend.data索引相关
type:'line',//折线图
data:[112,23,45,56,233,343,454,89,343,123,45,76]
},
{
name:'杨国娥',//系列名
type:'line',//折线图
data:[54,543,23,322,33,63,111,222,23]
}
] }
myChart.setOption(option)
</script>

Echart的基础开发模板的更多相关文章

  1. 奉上简单的.Net后端开发模板

    假定一个场景,开始做开发的你,领导走到你的面前说道:"小伙子,看了简历和最近的工作表现,很不错,现在交给一个任务,开发一个简单的CMS后端接口吧,前端有人配合你",当时你内心读白: ...

  2. Vue基础项目模板

    https://github.com/wanglong/vue-element-admin.git 优化 Vue CLI 3 构建的前端项目模板(1)- 基础项目模板介绍 一站式开源运维平台,分享给大 ...

  3. 在Visual Studio 2015 中添加SharePoint 2016 开发模板

    前言 SharePoint 2016已经发布很久了,然而,默认安装VS2015以后,却没有SharePoint 2016的开发模板.其实问题很简单,和VS2012开发SharePoint 2013一样 ...

  4. Centos 基础开发环境搭建之Maven私服nexus

    hmaster 安装nexus及启动方式 /usr/local/nexus-2.6.3-01/bin ./nexus status Centos 基础开发环境搭建之Maven私服nexus . 软件  ...

  5. Web基础开发最核心要解决的问题

    Web基础开发要解决的问题,往往也就是那些框架出现的目的 - 要解决问题. 1. 便捷的Db操作: 2. 高效的表单处理: 3. 灵活的Url路由: 4. 合理的代码组织结构: 5. 架构延伸 缓存. ...

  6. [Android] 环境配置之基础开发环境(SDK/Android Studio)(转)

    [Android] 环境配置之基础开发环境(SDK/Android Studio)   博客: blog.csdn.net/qiujuer 网站: www.qiujuer.net 开源库: Geniu ...

  7. SharePoint2010沙盒解决方案基础开发——关于TreeView树形控件读取列表数据(树形导航)的webpart开发及问题

    转:http://blog.csdn.net/miragesky2049/article/details/7204882 SharePoint2010沙盒解决方案基础开发--关于TreeView树形控 ...

  8. Dynamics CRM 开发模板使用手册(插件开发)

    CRM开发手册 本手册介绍在Visual Studio 2015 + Dynamics CRM Developer Extensions模板开发环境下,插件和JS脚本的开发.部署与调试过程. 手册中提 ...

  9. 微信小程序开发模板消息的时候 出现 errcode: 41028, errmsg: "invalid form id hint:

    小程序开发模板消息的时候  出现 errcode: 41028, errmsg: "invalid form id hint: 我是使用的微信支付发送模板消息,提示的formid无效的 大家 ...

随机推荐

  1. 修改ligerui 默认确认按钮

    $.extend($.ligerDefaults.DialogString, {ok: '取消单据'}); showDialogPay = $.ligerDialog.alert('正在支付中,请稍候 ...

  2. C10K——千万级并发实现的秘密:内核不是解决方案,而是问题所在!(转)

    既然我们已经解决了 C10K并发连接问题,应该如何提高水平支持千万级并发连接?你可能会说不可能.不,现在系统已经在用你可能不熟悉甚至激进的方式支持千万级别的并发连接. 要知道它是如何做到的,我们首先要 ...

  3. 【Oracle】将表名与字段名连接成一行数据展示,字段名使用顿号的分隔

    select '<'||a.comments||'>:'||replace(wmsys.wm_concat(b.comments),',','.')||'.' as pjzf from u ...

  4. Python之filter筛选数据工具

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #Python之filter筛选数据工具 #http://python.jobbole.com/82597/ ...

  5. echo “新密码”|passwd --stdin 用户名

    --stdin This option is used to indicate that passwd should read the new password from standard input ...

  6. spring cloud单点登录

    概述 基于springcloud的单点登录服务及基于zuul的网关服务(解决了通过zuul转发到认证服务之后session丢失问题) 详细 代码下载:http://www.demodashi.com/ ...

  7. HDFS架构设计

    原文:http://hadoop.apache.org/docs/r2.6.4/hadoop-project-dist/hadoop-hdfs/HdfsDesign.html 介绍 HDFS是个分布式 ...

  8. 一个PHP操作大变量的例子

    By C extensions we can directly manipulate the large PHP variables, such as:GET,POST,SERVER You can ...

  9. Emacs 文件中的查找操作

    1,在本文件中查找 list-matching-lines 命令会列出本文件中所有出现text的地方.下面是它的一个输出示例: 7 matches for "ngx_http_wait_re ...

  10. Python 的 Matplotlib 画图库

    Matplotlib安装 NumPy库方便数值运算,但枯燥的数据并不利于人们的直观理解. 数据需要可视化. Matplotlib:一个数据可视化函数库 使用前需要安装  利用Python自带 ...