function loadRainFallCharts(msg) {
var obj = {};
obj.x = [];
obj.y = [];
obj.line = [];
var accumulation = 0;
$(msg).each(function () {
obj.x.push(this.datatime);
obj.y.push(this.avgvalue);
accumulation += this.avgvalue;
obj.line.push(accumulation);
});
var myChart = echarts.init(document.getElementById('inThePast6hours_rainfall')); var option = {
title: {
text: '实时雨量曲线(过去6小时)',
subtext: '',
x: 'center',
align: 'right'
},
legend: {
data: ['时段降水', '累积降水'],
x: 'left'
},
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: obj.x.map(function (str) {
return str.replace(' ', '\n')
}),
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value',
name: '雨量(mm)',
nameLocation: 'start',
inverse: true
}
],
series: [
{
name: '时段降水',
type: 'bar',
barWidth: '60%',
data: obj.y
}, {
name: '累积降水',
type: 'line',
stack: '广告',
data: obj.line
},
]
}; myChart.setOption(option);
}

依赖:http://files.cnblogs.com/files/gaocong/echarts.js

echarts(3.0)的基本使用(标签式导入)的更多相关文章

  1. 关于echarts的使用----模块化单文件引入(推荐) 与标签式单文件引入

    官网:http://echarts.baidu.com/echarts2/doc/doc.html#引入ECharts3 关于模块化单文件引入(推荐) 与标签式单文件引入

  2. echarts学习心得1---模块化单文件引入和标签式单文件引入

    一.模块化单文件引入 1. 为ECharts准备一个具备大小(宽高)的Dom(当然可以是动态生成的) <div id="main" style="height:40 ...

  3. bootstrap历练实例:标签式的导航菜单

    本章将讲解bootstrap提供的用于定义导航元素的一些选项,它使用相同的标签和基类.nav.Bootsrtap也提供了一个用于共享标记和状态的帮助器类.改变修饰的class,可以在不同的样式间进行切 ...

  4. VUE实现Studio管理后台(完结):标签式输入、名值对输入、对话框(modal dialog)

    一周的时间,几乎每天都要工作十几个小时,敲代码+写作文,界面原型算是完成了,下一步是写内核的HTML处理引擎,纯JS实现.本次实战展示告一段落,等RXEditor下一个版本完成,再继续分享吧.剩下的功 ...

  5. iOS开发笔记13:顶部标签式导航栏及下拉分类菜单

    当内容及分类较多时,往往采用顶部标签式导航栏,例如网易新闻客户端的顶部分类导航,最近刚好有这样的应用场景,参考网络上一些demo,实现了这种导航效果,记录一些要点. 效果图(由于视频转GIF掉帧,滑动 ...

  6. j2ee5.0开发中jstl标签失效

    尝试了下,对于Weblogic中的出现的错误,也是有效的!   j2ee5.0开发中jstl标签失效 原因不详, 解决办法, 一:将.web.xml中 <web-app version=&quo ...

  7. python测试开发django-41.crispy-forms设计标签式导航菜单(TabHolder)

    前言 xadmin的详情页面主要是用form_layout布局,学会了完全可以不用写html代码,也能做出很好看的页面. xadmin的html页面是用的Bootstrap3框架设计的,layout布 ...

  8. 个人永久性免费-Excel催化剂功能第75波-标签式报表转标准数据源

    数据处理永远是数据分析工作中重中之重的任务,大部分人深深地陷入在数据处理的泥潭中,今天Excel催化剂再接再厉,在过往已提供了主从结构报表数据源的数据转换后,再次给大家送上标签式报表数据源的数据转换操 ...

  9. 分享一个仿网易新闻客户端iPhone版的标签式导航ViewController

    该Controller是一个容器,用于容纳其他的controller.效果与网易新闻客户端的标签式导航基本一样: (1)点击上面的标签,可以切换到对应的controller,标签下面的红色提示条的长度 ...

随机推荐

  1. linux设备驱动:中断的实现

    一.什么是中断 中断分两种: 1)中断,又叫外部中断或异步中断,它的产生是由于外设向处理器发出中断请求.其中外部中断也有两种,这是由配置寄存器设定的:普通中断请求(IRQ)和快速中断请求(FIQ).一 ...

  2. 第十五章 MySQL 数据库

    学习要点:1.Web 数据库概述2.MySQL 的操作3.MySQL 常用函数4.SQL 语句详解5.phpMyadmin 一.Web数据库概述 现在,我们已经熟悉了PHP 的基础知识,这是我们想暂时 ...

  3. iTOP-4412 开发板的 GPIO 是怎么操作的?

    Exynos4412 全部的 GPIO 都有固定的地址,为了方便操作这些 GPIO.Linux 内核 在 gpio-exynos4.h 里面定义了一些 GPIO 的宏.比如: #define EXYN ...

  4. npm添加淘宝镜像

    原文:http://cnodejs.org/topic/4f9904f9407edba21468f31e npm是一个很好用的工具,全场是Node Packet Manager,是一个nodejs的包 ...

  5. RGB颜色工具大全 and 网页配色方案

    RGB颜色工具:http://www.ostools.net/commons?type=3 配色方案:http://www.wzsky.net/html/Website/Color/103380.ht ...

  6. 64位WinRAR5.0破解

    在WinRAR安装文件夹下新建文件rarreg.key,用记事本打开rarreg.key把上面的内容复制到记事本再把rarreg.key里保存即可,文件内容如下: RAR registration d ...

  7. linux 单机跨进程通信

    一般来说通过网络通信(比如tcp,udp)或者共享内存的方式肯定可以实现跨进程通信,但现在这里要说的是比较偏但实用的几个方法:利用unix域通信(普通网络连接),利用unix域通信(socketpai ...

  8. 异步编程C#回调方法

    1.什么是异步? 异步操作通常用于执行完成时间可能较长的任务,如打开大文件.连接远程计算机或查询数据库.异步操作在主应用程序线程以外的线程中执行.应用程序调用方法异步执行某个操作时,应用程序可在异步方 ...

  9. 推荐系统学习03-SVDFeature

    介绍 SVDFeature是由Apex Data & Knowledge Management Lab在KDD CUP11竞赛中开发出来的工具包.它的目的是有效地解决基于特征的矩阵分解.新的模 ...

  10. tcpdump抓包(转)

    Linux 环境下,通常通过 tcpdump 来进行抓包和分析.它是几乎所有 Linux 发行版本预装的数据包抓取和分析工具. tcpdump 工具的获取和安装可以参阅相应操作系统的官方文档,本文不再 ...