易捷框架之EChart 的使用
需要用到百度的报表控件 ,总结如下:
1,先引入开发包,以及主题包:
<%@ include file="./common/echarts_header.jsp"%>
2,普通初始化图表,通过调用开发包
eCharts0 = ec;
myChart0 = eCharts0.init(document
.getElementById('share'),
'default');
myChart0.showLoading({
text : "图表数据正在努力加载..."
}
require([ 'echarts','echarts/chart/pie', // 使用饼图就加载pie模块,按需加载], DrawEChart0 //异步加载的回调函数绘制图表
);
3,设置option属性
//定义图表options
var options0 = {
title : {
text : "共享分布统计",
x : "center"
},
tooltip : {
show : false,
trigger : 'item',
formatter : "{a} <br/>{b} : {c} ({d}%)"
},
legend : {
orient : 'vertical',
x : 'left',
y : 'top'
},
toolbox : {
show : true },
calculable : false,
series : [ {
name : '共享类型',
type : 'pie',
radius : '60%',
center : [ '51%', '55%' ],
itemStyle : {
normal : {
label : {
position : 'outer',
formatter : function(
params) {
return params.name
+ ":"
+ params.value
+ "类("
+ (params.percent - 0)
.toFixed(0)
+ '%)'
}
},
labelLine : {
show : true
}
},
emphasis : {
label : {
show : true,
position : 'inner',
formatter : "{b}:{c}\n{d}%"
}
} },
} ]
}; }
其中:title:表示标题,
tooltip:提示框,
legend图例,
calculable可设置是否拖拽,
series设置数据(data类型也为数组类型)
到这就算是基本完事。。。。。
剩下的优化自行百度。。。。
易捷框架之EChart 的使用的更多相关文章
- 【FishFX】花式撩骚,打造TypeScript易用框架。
· 栗子入手 假设有以下foo数组,数组中每个对象都拥有id,name两个属性,现在需要查找id > 0的对象数量. const foo: Array<{ id: number, name ...
- 易捷支付完整业务流程的lr脚本编写
业务流程:1.注册2.登录3.重置支付密码4.下订单5.支付订单6.查看订单列表 通用md5.h代码如下: #ifndef MD5_H #define MD5_H #ifdef __alpha typ ...
- 如何编写轻量级 CSS 框架
Github 地址: https://github.com/nzbin/snack Demo 演示: https://nzbin.github.io/snack/ 前言 这篇文章我已经酝酿了半年之久, ...
- 详细说明php的4中开源框架(TP,CI,Laravel,Yii)
ThinkPHP简称TP,TP借鉴了Java思想,基于PHP5,充分利用了PHP5的特性,部署简单只需要一个入口文件,一起搞定,简单高效.中文文档齐全,入门超级简单.自带模板引擎,具有独特的数据验证和 ...
- 学习abp vnext框架到精简到我的Vop框架
学习目标 框架特点 基于.NET 5平台开发 模块化系统 极少依赖 极易扩展 ....... 框架目的 学习.NET 5平台 学习abp vnext 上图大部分功能已经实现,多数是参考(copy)ab ...
- 中国人工智能AI框架自主研发
中国人工智能AI框架自主研发 中国AI界争相构建AI开源框架的背后,技术和业务层面的考量因素当然重要,但也不应忽视国家层面的政策支持.对于AI基础设施的建设,中国政府在<新一代人工智能发展规划& ...
- 如何在ie6/ie7/ie8中实现iframe背景透明
最近做了一个项目,涉及到ie8iframe背景透明的问题,做了老半天,才把它搞定的,现在把我的经历贴出来和大家分享: 众所周知的根据W3C CSS 2.1 规范规定,''''background-co ...
- OpenStack黄金十年:我与OpenStack的故事
导读:从2010年到2020年,OpenStack项目整整走过了十个春夏秋冬.不管是OpenStack基金会,还是积极参与OpenStack社区的厂商.企业乃至开发者,想必都有肺腑之言想对OpenSt ...
- 【PCB】扫盲总结
1.PCB是什么 PCB( Printed Circuit Board),中文名称为印制电路板,又称印刷线路板,是重要的电子部件,是电子元器件的支撑体,是电子元器件电气连接的载体.由于它是采用电子印刷 ...
随机推荐
- koa2 中间件里面的next到底是什么
koa2短小精悍,女人不爱男人爱. 之前一只有用koa写一点小程序,自认为还吼吼哈,知道有一天某人问我,你说一下 koa或者express中间件的实现原理.然后我就支支吾吾,好久吃饭都不香. 那么了解 ...
- ubuntu下Python的安装和使用
版权声明 更新:2017-04-13-上午博主:LuckyAlan联系:liuwenvip163@163.com声明:吃水不忘挖井人,转载请注明出处! 1 文章介绍 本文介绍了Python的开发环境. ...
- java基础:eclipse编程不得不知道的技巧
如果你是位具有开发经丰富的工程师,在开发的过程中,你就会很强烈的要求快捷的编程.如何快捷编程,只有更加熟悉开发工具.那么eclipse是同样也有很多技巧.可以带着下面问题来阅读1.如何查找类相关信息? ...
- python 抓取网页一部分
import re import requests from bs4 import BeautifulSoup response = requests.get("https://jecvay ...
- 《DSP using MATLAB》示例Example7.9
代码: wp = 0.2*pi; ws = 0.3*pi; As = 50; tr_width = ws - wp; M = ceil((As-7.95)/(2.285*tr_width) + 1 ) ...
- Tree的两种存储形式
1.xml存储 2.链式结构存储 List<Node> nodes = new List<Node>() { , Name = "中国" }, , Name ...
- HttpMessageConvert
1. 我们先来看看框架会自动注册哪些httpmessageconvert? 在哪个地方开始注册的? 在对mvc:annotation-driven解析的AnnotationDrivenBeanDefi ...
- piezo film 压电相关信息记录 (2018-05-04 更新)
piezo film 压电相关信息记录 起因需要使用 Piezo 做一些设计 http://www.te.com.cn/chn-zh/videos/transportation/piezo-film- ...
- 莫名其妙的js基础学习!
JavaScript基本组成部分: 1,ECMAScript:js的语法标准,基本的变量,运算符,函数,if语句,for语句等 2,DOM:操作网页上的元素API,比如盒子的移动,变色,轮播图等. 3 ...
- 什么是spark(一) 分区以及和MR的区别
什么是spark,是一个分布式计算平台,或者说是分布式计算引擎,他的职责就是将指定的数据读入到各个node的内存中,然后计算.所以spark是具有泛化性质的,只要数据源是可读入的,读到内存里面之后,处 ...