Jqplot在joomla组件中的应用
(1)在com_collect组件中采用的是ajax获取json类型的值。[http://www.jqplot.com/tests/data-renderers.php]这上边有实例。
(2)在jqplot中由于X轴上的文字密集,最开始想到的是给文字设置一个倾斜角度,angle = 30,可是发现我的字体还是密密麻麻的,没有变化,后来我在查找问题时发现可以设置x轴每个坐标的宽度,即设置 .jqplot-xaxis-tick的宽度,设置之后还是不行,文字超出了div的边界显示,最后给div设置了css属性:white-space:normal,(当文字超出div边界就换行)才可以使文字竖直显示。
(3) 在com_repairreport组件中采用的是ajax获取json类型的值。[http://www.jqplot.com/tests/data-renderers.php]这上边有实例。基本思路是用ajax获取json类型的数值,传递到$jqplot('target','data','option')中的data值即可。
(4) 在jqplot中由于X轴上的文字密集,最开始想到的是给文字设置一个倾斜角度,angle = 30,可是发现我的字体还是密密麻麻的,没有变化,后来我在查找问题时发现可以设置x轴每个坐标的宽度,即设置 .jqplot-xaxis-tick的宽度,设置之后还是不行,文字超出了div的边界显示,最后给div设置了css属性:white-space:normal,(当文字超出div边界就换行)才可以使文字竖直显示。但是当X轴的值为日期时发现还是没有办法正常显示,后来又添加了代码word-break: break-all;word-wrap: break-word;强制换行。
(5)jqplot的折线图rendererOption不需要加载渲染器,对于饼状图则需要加载renderer: $.jqplot.PieRenderer,对于柱状图邪恶需要加载renderer: $.jqplot.PieRenderer,
(6) 在一个图表中显示多条曲线的问题,由于我采用的data都是json类型的数值,当有多条曲线时,我采用ajax传递的值时一个含有多层嵌套的json数组的值,通过访问$.jqplot('chart1',[ret[0],ret[1],ret[2],ret[3]],{})来显示多条曲线,在显示多条曲线时候采用legend:{show:true,location:'ne'},series: [{label: '总报修次数'}, {label: '家属区报修次数'}, {label: '学生区报修次数'}, {label: '办公区报修次数'}],设置每一条曲线代表的含义。
(7)设置柱状图旋转90度,我设置的时候,只需把xaxis,yaxis与正常显示是互换位置即可,同时利用ajax获取的值也要进行同样的呼唤。
有与jqplot的特点是柱状图无法显示具体数据值,饼状图无法显示具体百分比,因此在饼状图中我显示百分比时采用的方法是把值传递到json数组中的名称中
(我写的joomla组件整理的知识,http://wiki.stdu.edu.cn/index.php/Ym_joomla%E7%BB%84%E4%BB%B6
Jqplot在joomla组件中的应用的更多相关文章
- vue.js 1中父组件跳到子组件中并传参让子组件显示不同的内容
父组件中的点击跳转: <ul class="insurance-entry clearfloat"> <li v-link="{name:'produc ...
- storm-kafka组件中KafkaOffsetMetric相关统计指标说明
storm-kafka组件中KafkaOffsetMetric相关统计指标说明 storm-kafka是storm提供的一个读取kakfa的组件,用于从kafka队列中消费数据.KafkaOffset ...
- react 不能往组件中传入属性的值为 undefined
在使用 andt design 的时候遇到个需求,需要清除 Select 组件选中后的值,让它变成什么都没选中,显示 placeholder 刚开始以为设置为 null 即可,结果发现设置为 null ...
- 在 Java EE 组件中使用 Camel Routes
摘要:你可以通过集成 Camel 和 WildFly 应用服务器(使用 WildFly-Camel 子系统)在 Java EE 组件中开始使用 Apache Camel Routes. [编者按]作者 ...
- Qt组件中的双缓冲无闪烁绘图
双缓冲绘图在Qt4中,所有的窗口部件默认都使用双缓冲进行绘图.使用双缓冲,可以减轻绘制的闪烁感.在有些情况下,用户要关闭双缓冲,自己管理绘图.下面的语句设置了窗口部件的Qt::WA_PaintOn ...
- Android(java)学习笔记186:对ListView等列表组件中数据进行增、删、改操作
1.ListView介绍 解决大量的相似的数据显示问题 采用了MVC模式: M: model (数据模型) V: view (显示的视图) C: controller 控制器 入门案例: acit ...
- 如何在SSIS的脚本组件中访问变量
原文:如何在SSIS的脚本组件中访问变量 这是一个小问题,我们在SSIS的设计中很多地方都会用到变量,我习惯性地将"变量"和"表达式"称为SSIS的灵魂,虽然不 ...
- vue组件之间的通信以及如何在父组件中调用子组件的方法和属性
在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...
- 你真的知道组件中的v-model吗?
v-model的神奇 html <div id="app"> <input v-model="poin"> {{ poin }} < ...
随机推荐
- Java SE ---关系运算符
java里的关系运算符有这么几种:大于(>).小于(<).等于(==).不等于(!=).大于等于(>=).小于等于(<=), 关系运算的结果是个boolean值,关系式成立为t ...
- nodejs的mysql模块学习(三)数据库连接配置选项详解
连接选项 当在创建数据连接的时候 第一种大多数人用的方法 let mysql = require('mysql'); let connection = mysql.createConnection({ ...
- struts2.1笔记02:servlet简介
1. Servlet 是在服务器上运行的小程序.这个词是在 Java applet的环境中创造的,Java applet 是一种当作单独文件跟网页一起发送的小程序,它通常用于在客户端运行,结果 ...
- Linux parted 分区
转自http://tilt.lib.tsinghua.edu.cn/node/889 如何使用parted对齐分区以得到最优性能 Sat, 03/08/2014 - 18:02 - tlblues ...
- python(6)-类
面向对象编程是一种编程方式,此编程方式的落地需要使用 "类" 和 "对象" 来实现,所以,面向对象编程其实就是对 "类" 和 "对 ...
- 自定义HBase的协处理器(Observer)
自定义一个Observer... 总共分五步: 1°.继承BaseMasterObserver (写代码 具体看博客....) 案例(当在HBase中创建表的时候在日志中有相关输出): impor ...
- [ImportNew]Java线程面试题
Java语言一个重要的特点就是内置了对并发的支持,让Java大受企业和程序员的欢迎.大多数待遇丰厚的Java开发职位都要求开发者精通多线程技术并且有丰富的Java程序开发.调试.优化经验,所以线程相关 ...
- Servlet & JSP - Form-based Authentication
基本认证和摘要认证都只能使用浏览器自带的登录框而不能使用自定义的登录页面.如果必须使用自定义的登录页面,则可以选择基于表框的认证方式. 基于表框的认证的配置与基本认证和摘要认证的差别在于部署描述符中 ...
- Django学习--9 Admin
1.vim settings.py 打开 'django.contrib.admin' vim urls.py 打开 from django.contrib import admin (注意 ...
- HDOJ2028Lowest Common Multiple Plus
Lowest Common Multiple Plus Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (J ...