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 }} < ...
随机推荐
- css笔记08:id选择器之父子选择器
1.父子选择器 (1)01.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...
- TensorFlow学习之运行label_image实例
前段时间,搞了搞编译label_image中cc的实例,最后终于搞定...但想在IDE中编译还没成功,继续摸索中. 现分享一下,探究过程,欢迎叨扰,交流. 个人地址:http://home.cnblo ...
- scrapy_ip_agent
#File name is rotate_useragent# -*- coding: UTF-8 -*- import randomimport urllib2import redisfrom sc ...
- 【WebKit】---WebKit的CSS扩展(WebKit是私有属性)
1.-webkit-touch-callout 当你触摸并按住触摸目标时候,禁止或显示系统默认菜单.在iOS上,当你触摸并按住触摸的目标,比如一个链接,Safari浏览器将显示链接有关的系统默认菜单. ...
- JS定位PDF页码。
由于项目中的PDF文章段落标题有些是英文,对其翻译后需要定位到具体的页码. 查询相关资料及进行尝试后发现可以用如下方法可以实现 function gotoPage(page) { ...
- jqueryeasyui中文乱码问题
下载的Demo中charset=utf-8,手动改成gb3212,问题解决.
- python学习day4--python基础--元组,字符串
1.元组 #只读列表,元组,当希望生成后不被修改则用元组 r=(1,2,3,4,5) 元组 2.字符串,python字符串操作非常丰富,编程时可先查询python本身是否已设计了相关函数 #移除空白 ...
- Appcn 移动开发 前台与服务器数据交互
第一次写.嘿嘿. 言归正传,这几天开始学习移动开发,使用的是Appcan平台.Appcan平台采用HTML5+CSS3做开发 实现跨平台,正好可以满足我们的业务需求. Appacn和数据库进行交互的方 ...
- Linux学习三部曲(之二)
新建Linux分区以及文件系统 今天,我们来聊聊在linux上建立分区和文件系统.windows系统建立分区可以借助分区工具,那么在linux分区以及文件系统又该如何操作呢? 打开secureCRT, ...
- Entity Framework 之三层架构
今天,我们谈一下如何用Entity Framework构建一个三层架构.即包括DAL层,BLL层和MODEL层.我们先看一下目录结构,如下图: 目录中,我们有Web层,AVON.DMS.Model是实 ...