易捷框架之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类型也为数组类型)

到这就算是基本完事。。。。。

剩下的优化自行百度。。。。

时间: 2024-12-28 19:34:37

易捷框架之EChart 的使用的相关文章

详细说明php的4中开源框架(TP,CI,Laravel,Yii)

ThinkPHP简称TP,TP借鉴了Java思想,基于PHP5,充分利用了PHP5的特性,部署简单只需要一个入口文件,一起搞定,简单高效.中文文档齐全,入门超级简单.自带模板引擎,具有独特的数据验证和自动填充功能,框架更新速度比较速度. 优点:这个框架易使用 易学 安全 对bae sae支持很好提供的工具也很强大 可以支持比较大的项目开发 易扩展 全中文文档 总的来说这款框架适合非常适合国人使用 性能 上比CI还要强一些 缺点:配置对有些人来说有些复杂(其实是因为没有认真的读过其框架源码)文档有

如何编写轻量级 CSS 框架

Github 地址: https://github.com/nzbin/snack Demo 演示: https://nzbin.github.io/snack/ 前言 这篇文章我已经酝酿了半年之久,或者说拖沓了这么久吧.想说的东西很多,却又无从说起.如今轻量级框架如雨后春笋,层出不穷.我想每个人都应该归纳总结工作中的常见需求,编写一套适合自己的 CSS 框架.在之前的文章中,我提到了面向对象的 CSS(比如 BEM.OOCSS.SMACSS,详见 http://vanseodesign.com

PHP三大框架对比

写PHP程序一年有余期间使用了CI, ThinkPHP, Phalcon等框架说一下我的感受 CI 优点: 这个框架的入门槛很底 极易学 极易用 框架很小 静态化非常容易 框架易扩展 文档比较详尽 缺点: 在极易用的极小下隐藏的缺点即是不安全 功能不是太全 缺少非常多的东西 比如你想使用mongoDB你就得自己实现接口... 对数据的操作亦不是太安全 比如对update和delete操作等不够安全 暂不支持sae bae等(毕竟是欧洲)对大型项目的支持不行 小型项目会非常好 ThinkPHP 优

程序员必备:那些GitHub上最受欢迎的框架你收藏了几个?

转眼间2020年已经过去了近两个月,在祈祷疫情尽快消散的同时,大家也不要忘了学习啊! 众所周知前端开发是一个综合性比较强的编程工作,前端开发人员不仅需要一定的审美观和设计观,同时还需要精通诸如HTML.CSS.JavaScript等错综复杂的技术.因此,在前端开发工作中,借用一些开发框架往往能达到事半功倍的效果. 今天的文章小渡为大家搜罗了数十款目前最受程序员欢迎的前端CSS框架,其中有的霸榜已久,也有不少后起之秀,有的是单纯的CSS框架,也有的结合了JavaScript以提供更丰富的功能.一起

中石化牵手腾讯 背后隐藏了啥秘密?

中石化与腾讯之间长达半年之久的"绯闻"最终在8月26日坐实.当天,中国石化销售有限公司与腾讯科技签订业务框架合作协议,两方将建立长期.全面的战略合作伙伴关系,在业务开发与推广.移动支付.媒介宣传.O2O业务.地图导航.用户忠诚度管理.大数据应用与交叉营销等领域探索开展合作. 早在8月8日,中石化集团官网高层动态信息栏曾挂出的消息称,8月7日,中石化集团公司董事长傅成玉在总部会见腾讯公司总裁刘炽平一行.这也是截至眼下,全部传言将參与中石化销售公司混改合作的企业中,唯一在合作前被中石化公开

如何在ie6/ie7/ie8中实现iframe背景透明

最近做了一个项目,涉及到ie8iframe背景透明的问题,做了老半天,才把它搞定的,现在把我的经历贴出来和大家分享: 众所周知的根据W3C CSS 2.1 规范规定,''''background-color'''' 特性的默认值为 ''''transparent'''',即透明:但是IE6/IE7/IE8中 BODY 元素的背景色不是 transparent,而是 #FFFFFF;也就是变成了白色的. 其实,有一点我们是要注意的,也是必须知道的,在iframe中这个背景是其本身,不是iframe

开源推动人工智能普及化,软件吞噬世界正成为现实

(上图为Linux基金会副总裁.CNCF原生云计算基金会首席运营官Chris Aniszczyk) "开源软件和人工智能正在吞噬世界."这是Linux基金会副总裁.CNCF原生云计算基金会首席运营官Chris Aniszczyk在2017软博会的中国开源产业峰会上所做的判断.在Chris看来,开源软件与人工智能是互相促进.互相推动,"未来每家公司都将成为软件公司". 今年初刚刚宣布完成5000万美元C轮融资的国内开源云公司EasyStack,在本次开源峰会上发布了全

#IT互联网财经事实半月谈,安卓比ISO更好色?#

八月份的尾巴,你们都是大熊座:科技名人冰桶挑战,冷水一盆接着一盆,真乃屌丝费纸,大佬费水:iPhone6即将面世,苹果主动示好,而腾讯和中石化强强联合,把垄断艺术发挥到极致,至于说MSN的寿终正寝的事儿,早就在意料之中大家的悲伤时间不该超过5分钟,最后提醒各位在移动设备上看片时,一定要加小心- #苹果在中国存储数据,要装孙子?#据<路透社报道>,苹果公司确认已将中国用户的部分数据存储到中国电信的服务器上.这意味着苹果云数据存储首次进入中国大陆地区,而且此计划于15个星期前就开始启动,目前已经全

android源码大放送(实战开发必备),免费安卓demo源码,例子大全文件详细列表

免费安卓demo源码,例子大全文件详细列表 本列表源码永久免费下载地址:http://www.jiandaima.com/blog/android-demo 卷 yunpan 的文件夹 PATH 列表 卷序列号为 0000-73EC E:. │ jiandaima.com文件列表生成.bat │ 例子大全说明.txt │ 本例子永久更新地址~.url │ 目录列表2016.03.10更新.txt │ ├─前台界面 │ ├─3D标签云卡片热门 │ │ Android TagCloudView云标签