ECharts：企业报表工具
ECharts。纯Javascript图表库，基于Canvas，底层依赖ZRender。商业产品经常使用图表库，提供直观，生动。可交互，可个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验，赋予了用户对数据进行挖掘、整合的能力。图表类型支持折线图（区域图）、柱状图（条状图）、散点图（气泡图）、K线图、饼图（环形图）、地图、力导向布局图，同一时候支持随意维度的堆积和多图表混合展现。
一、搭建好开发环境：
1、进入echarts的官网，下载echarts-master的压缩包，解压，点击进入index.xml。
2、选择顶部的API&Doc，打开附录。
3、MyEclipse中建立一个项目。建立两个目录（echarts,zrender）
4、将解压包下的src下的全部复制到echarts下。
5、按顺序导入4个js文件：
doc\asset\js\ jquery.js 、doc\asset\js\bootstrap.js 、doc\asset\js\esl\esl.js 、doc\asset\js\esl\js.js
代码实现：
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/esl.js"></script>
<script type="text/javascript">
function init() {
// 初始化载入支持js文件包的。 require.config({
paths: {
'js': 'js/js'
},
packages: [
{
name: 'echarts',
location: 'echarts',
main: 'echarts'
},
{
name: 'zrender',
location: 'zrender',
main: 'zrender'
}
]
});
//初始化数据
var option = {
//工具提示
tooltip : {
trigger: 'axis'
},
//图例
legend: {
data:['蒸发量','降水量']
},
//工具箱
toolbox: {
//使用工具箱
show : true,
//工具箱中包括的功能
feature : {
//是否增加标记
mark : true,
//能否够改变数据，从而动态改变图
dataView : {readOnly: false},
//能否够在线性柱状图之间切换
magicType:['line', 'bar'],
restore : true
}
},
//是否同意拖拽
calculable : true,
//增加横轴的内容
xAxis : [
{
type : 'category',
data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
}
],
//增加纵轴的内容
yAxis : [
{
type : 'value',
splitArea : {show : true}
}
],
//详细数据
series : [
{
name:'蒸发量',
type:'bar',
data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
},
{
name:'降水量',
type:'bar',
data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
}
]
};
require(
[
'echarts',
'echarts/chart/line',
'echarts/chart/bar',
],
function(ec) {
var myChart = ec.init(document.getElementById('mydiv'));
myChart.setOption(option);
}
)
}
</script>
</head>
<body onload="init();">
<div id="mydiv" style="width:1000px;height:600px;"></div>
</body>
ECharts：企业报表工具的更多相关文章
- 企业为什么需要BI报表工具？
企业一旦成规模运作起来,数据量是数以万计的,无论数据还是报表都需要协同管理不断更新.面对各大OA\ERP\CRM系统的数据,传统用Excel处理数据效率是很低下的.要想快速出报表,快速取数,快速做业务 ...
- 能无缝嵌入Excel的报表工具，报表轻松做！
现在很多人做数据分析会被推荐选择去用编程R和Python.PowerBI.Tableau.Qlik.Smartbi... 从目前数据分析的行业来说,Excel是世界上使用人数最多的报表分析工具,没有之 ...
- 作为报表工具，Excel移动报表的优势和劣势
Excel是应用最广泛的报表工具,它集数据存储.数据处理.数据分析于一身,广泛应用于各行各业的日常工作中(无论这个企业的信息化程度有多高.多低).而且随着Office365的普及,软件License的 ...
- 设计与开发一款简单易用的Web报表工具（支持常用关系数据及hadoop、hbase等)
EasyReport是一个简单易用的Web报表工具(支持Hadoop,HBase及各种关系型数据库),它的主要功能是把SQL语句查询出的行列结构转换成HTML表格(Table),并支持表格的跨行(Ro ...
- 国内BI工具/报表工具厂商简介
v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VM ...
- 报表工具ActiveReports开发实例——物联网智能供水云平台
一.公司简介 山西汾西电子科技股份有限公司(以下简称:汾西电子)是经中国船舶重工集团批准,在原汾西重工电子科技公司基础上重组的专业从事智能电能表.水表.热量表及电动汽车充电设备研发生产的高科技公司. ...
- 【案例分享】使用ActiveReports报表工具，在.NET MVC模式下动态创建报表
提起报表,大家会觉得即熟悉又陌生,好像常常在工作中使用,又似乎无法准确描述报表.今天我们来一起了解一下什么是报表,报表的结构.构成元素,以及为什么需要报表. 什么是报表 简单的说:报表就是通过表格.图 ...
- 国内专业web报表工具，完美解决中国式报表难题
近几年报表工具的热度不断上升,很多企业都用上了全新的报表工具,主要是企业数据化转型已经成为趋势.在进行选型的时候,很多企业最好都选择国内的报表工具,相信一些人不知道为什么国内的报表工具表现比国外的好. ...
- 开源报表工具太复杂？不如用这款免费web报表工具
随着信息系统的高速发展,报表平台逐渐成为了信息系统当中最为核心和重要的功能模块.报表工具有助于将原始数据可视化显示,使决策者或者相关人员能够一览整体的数据趋势,完整的报表解决方案会提供多样的表格数据展 ...
随机推荐
- [shell编程] sh脚本异常：/bin/sh^M:bad interpreter: No such file or directory
转载地址:http://www.cnblogs.com/pipelone/archive/2009/04/17/1437879.html 在Linux中执行.sh脚本,异常/bin/sh^M: bad ...
- Node.js 调用 restful webservice
如何构建一个restful web service参考原来的文章 http://www.cnblogs.com/ericnie/p/5212748.html 直接用原来的项目编译好像有问题,此处耗费1 ...
- 快速打开IIS的方法
方法一: 在运行(win+r)输入inetmgr 方法二: 控制面板\所有控制面板项\管理工具\IIS 建议使用第一种方法
- 怎样用bat批量重命名文件夹和文件
很早以前本人写过重命名文件夹的文章,发现其中稍有不完善的地方,其主要功能在文件夹名前统一加上字符,或者在文件夹名后统一加上字符,有网友反应功能太单一.今天我又仔细研究了一下bat批处理代码,分别能完全 ...
- CentOS7下nrpe3.0安装(转)
本人菜鸟一枚,在学习nagios的时候碰到了很多问题,在网上找了很多相关的教程,都是老版本的,怎么装都不对,强迫症的我非要按装新版本,老版本的教程怎么搞都不行,只能自己研究了. 首先,下载nrpe3. ...
- postprocessing stack v2
用了v2和unity2017.3.0f有兼容性问题 在assetbundle的情况下 CopyStd这个shader打不进去 在assetbundle的menafest里面有列但是shader.fin ...
- java源码阅读LinkedList
1类签名与注释 public class LinkedList<E> extends AbstractSequentialList<E> implements List< ...
- Scala快学笔记（二）
一,基本概念 1,映射 Map与HashMap与TreeMap,SotredMap等区别: 1.HashMap键无序,它根据键的HashCode值存储数据,根据键可以直接获取它的值,具有很快的访问速度 ...
- 【微信转载】Google是如何做测试的
就 目前的软件公司而言,Google无疑是在开放和创新力方面做得最好的.而如何支撑Google这种快速地扩张的研发能力以及迭代速度,并且产品质量总是 一如以往的能给人们很棒的用户体验?这是一个值得我们 ...
- hdu1509（Windows Message Queue） 优先队列
点击打开链接 Problem Description Message queue is the basic fundamental of windows system. For each proces ...