易捷框架之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),中文名称为印制电路板,又称印刷线路板,是重要的电子部件,是电子元器件的支撑体,是电子元器件电气连接的载体.由于它是采用电子印刷 ...
随机推荐
- BZOJ2049 SDOI2008 Cave 洞穴勘测 【LCT】
BZOJ2049 SDOI2008 Cave 洞穴勘测 Description 辉辉热衷于洞穴勘测.某天,他按照地图来到了一片被标记为JSZX的洞穴群地区.经过初步勘测,辉辉发现这片区域由n个洞穴(分 ...
- Navicat工具导出mySQL数据库某个视图结构的.sql脚本
用Navicat工具怎么都导不出来mySQL数据库的某个视图.sql脚本,即使导出来也只是包含视图记录,不包含视图结构.经过一番研究,终于克服,操作如下: 1.在某个数据库中,新建备份,如下图 2.选 ...
- LeetCode 417. Pacific Atlantic Water Flow
原题链接在这里:https://leetcode.com/problems/pacific-atlantic-water-flow/description/ 题目: Given an m x n ma ...
- Spring核心机制:依赖注入
转载:http://www.cnblogs.com/chenssy/ Java应用(从applets的小范围到全套n层服务端企业应用)是一种典型的依赖型应用,它就是由一些互相适当地协作的对象构成的.因 ...
- [深度学习]实现一个博弈型的AI,从五子棋开始
好久没有写过博客了,多久,大概8年???最近重新把写作这事儿捡起来……最近在折腾AI,写个AI相关的给团队的小伙伴们看吧. 搞了这么多年的机器学习,从分类到聚类,从朴素贝叶斯到SVM,从神经网络到深度 ...
- ffmpeg/ffplay 添加实时的时间水印 (转)
右上角添加时间水印 ffmpeg -i 0.ts -vf drawtext="fontfile=arial.ttf:x=w-tw:fontcolor=white:fontsize=30:te ...
- python-生成测试报告-然后自动发送邮件
前两篇单独介绍了生成测试报告和自动发送邮件,那么现在把两者整合到一起:生成测试报告后然后自动发送邮件,这里只是简单的整合实现功能,其实还可以优化的,先用吧,后面再慢慢优化 先看下目录,其实目录还是一样 ...
- 读取设置config.ini配置
class CSenseIni { /************************************************************************/ /*写操作 * ...
- PAT1055___排序神题
题目意思比较简单,按财富,年龄,姓名来排序 看似挺普通的,但被坑了20多次TLE 首先排序只要一次,就是按题目规定的进行排序 然后在查询的时候,不是从头扫到尾看是否符合年龄的限制,而是记录这个年龄组在 ...
- erlang入门之编译和运行
测试erlang脚本如下 -module(empty). -author("mmc"). %% API -export([test/1,test/0]). test()-> ...