echarts(3.0)的基本使用(标签式导入)
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)的基本使用(标签式导入)的更多相关文章
- 关于echarts的使用----模块化单文件引入(推荐) 与标签式单文件引入
官网:http://echarts.baidu.com/echarts2/doc/doc.html#引入ECharts3 关于模块化单文件引入(推荐) 与标签式单文件引入
- echarts学习心得1---模块化单文件引入和标签式单文件引入
一.模块化单文件引入 1. 为ECharts准备一个具备大小(宽高)的Dom(当然可以是动态生成的) <div id="main" style="height:40 ...
- bootstrap历练实例:标签式的导航菜单
本章将讲解bootstrap提供的用于定义导航元素的一些选项,它使用相同的标签和基类.nav.Bootsrtap也提供了一个用于共享标记和状态的帮助器类.改变修饰的class,可以在不同的样式间进行切 ...
- VUE实现Studio管理后台(完结):标签式输入、名值对输入、对话框(modal dialog)
一周的时间,几乎每天都要工作十几个小时,敲代码+写作文,界面原型算是完成了,下一步是写内核的HTML处理引擎,纯JS实现.本次实战展示告一段落,等RXEditor下一个版本完成,再继续分享吧.剩下的功 ...
- iOS开发笔记13:顶部标签式导航栏及下拉分类菜单
当内容及分类较多时,往往采用顶部标签式导航栏,例如网易新闻客户端的顶部分类导航,最近刚好有这样的应用场景,参考网络上一些demo,实现了这种导航效果,记录一些要点. 效果图(由于视频转GIF掉帧,滑动 ...
- j2ee5.0开发中jstl标签失效
尝试了下,对于Weblogic中的出现的错误,也是有效的! j2ee5.0开发中jstl标签失效 原因不详, 解决办法, 一:将.web.xml中 <web-app version=&quo ...
- python测试开发django-41.crispy-forms设计标签式导航菜单(TabHolder)
前言 xadmin的详情页面主要是用form_layout布局,学会了完全可以不用写html代码,也能做出很好看的页面. xadmin的html页面是用的Bootstrap3框架设计的,layout布 ...
- 个人永久性免费-Excel催化剂功能第75波-标签式报表转标准数据源
数据处理永远是数据分析工作中重中之重的任务,大部分人深深地陷入在数据处理的泥潭中,今天Excel催化剂再接再厉,在过往已提供了主从结构报表数据源的数据转换后,再次给大家送上标签式报表数据源的数据转换操 ...
- 分享一个仿网易新闻客户端iPhone版的标签式导航ViewController
该Controller是一个容器,用于容纳其他的controller.效果与网易新闻客户端的标签式导航基本一样: (1)点击上面的标签,可以切换到对应的controller,标签下面的红色提示条的长度 ...
随机推荐
- Eclipse新建java类的时候,自动创建注释
为形成个人的java代码风格,我们在项目组中进行开发的时候,可以对自己的代码进行一些格式上面的设置,具体如下: 方法一:Eclipse中设置在创建新类时自动生成注释 windows–>prefe ...
- ZOJ 3792 Romantic Value 最小割(最小费用下最小边数)
求最小割及最小花费 把边权c = c*10000+1 然后跑一个最小割,则flow / 10000就是费用 flow%10000就是边数. 且是边数最少的情况.. #include<stdio. ...
- javascript快速入门5--数组与对象
数组 数组,实际上就是将一大堆相似的数据有秩序的放在格子箱中,十分像药房里的那些柜子. 数据1 数据2 数据3 数据4 数据5 数据6 用代码创建数组 var arr = new Array();// ...
- Highcharts、AJAX、JSON、JQuery实现动态数据交互显示图表柱形图
上个图给大家看下效果. 点击 查看图表 如下图展示效果 Highcharts简介 Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程 ...
- Solr6.6.0 用 SimplePostTool与界面dataimport索引方式区别
通过测试发现用SimplePostTool与solr界面dataimport索引数据的结果有如下区别: 1.SimplePostTool索引数据对结构化数据文件索引比较合适,比如csv/json/xm ...
- vmware已经全面支持open-vm-tools
以后不用再为vmware vm单独安装vmware-tools了,vmware已经全面支持open-vm-tools, 今天突然发现安装vmware-tools时出现deprecated提示,原来vm ...
- objc语言的运行时处理
在Objective-C中,消息是通过objc_msgSend()这个runtime方法及相近的方法来实现的.这个方法需要一个target,selector,还有一些参数.理论上来说,编译器只是把消息 ...
- iOS 系统框架
iOS的系统架构分为四个层次:核心操作系统层(Core OS layer).核心服务层(Core Services layer).媒体层(Media layer)和可触摸层(Cocoa Touch l ...
- HDU 5360 Hiking(优先队列)2015 Multi-University Training Contest 6
Hiking Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others) Total S ...
- git 基于某个分支创建分支
1.拷贝源代码 git clone git@git地址 cd 项目目录 2.根据已有分支创建新的分支 git checkout -b yourbranchname origin/oldbranchna ...