由于项目信息统计需要生成一些图表,找了一些免费的开源框架,最后决定使用jqPlot。
1)首先提供一下学习链接
官网的Option配置 : http://www.jqplot.com/docs/files/jqPlotOptions-txt.html
Option配置中文版 : http://blog.csdn.net/gaoyusi4964238/article/details/4378459
别人的例子参考 : http://blog.csdn.net/wtderek/article/details/22885939
2)从面对对象的角度来剖析jqPlot Option属性,(主要从xy轴,系列,数据点等)
title : 标题属性
axisDefaults :xy轴的默认配置
axis :xy轴的的独立配置
seriesDefaults :系列的默认配置(系列指的是图表的内容,例如线条,柱子,饼块等)
|--- markerOptions : 数据点的配置
series : 每个系列的独立配置
legend :分类名称框的配置
grid : 网格的配置
cursor : 光标的配置
highlighter : 数据点高亮动作的配置(例如鼠标移动到该点时弹框展示xy轴的数据)
3)jqPlot有很多渲染器,有xy轴的渲染器,有数据点的渲染器,有系列的渲染器等等
|--- dateAxisRenderer:
相关引用包:<script type="text/javascript" src="../plugins/jqplot.dateAxisRenderer.min.js" />
该渲染器主要用于显示刻度为日期格式的坐标轴,它增强了javascript的本地数据处理能力,
它几乎支持所有的日期格式。
另外,该渲染器还提供了强大的格式化功能,它能将数据中日期字符串格式化为你需要的格式
并显示在坐标轴的刻度线上。
|--- categoryAxisRenderer
相关引用包:<script type="text/javascript" src="../plugins/jqplot.categoryAxisRenderer.min.js" />
该渲染器主要用于将显示于刻度处的值显示与两个刻度之间,当然其表达意思也发生变化,因为
刻度值处值表示某个点处的值,而它则代表某个范围内的值。
该渲染器比较适合与柱状图联合使用。
|--- barRenderer
相关引用包:<script type="text/javascript" src="../plugins/jqplot.barRenderer.min.js" />
该渲染器主要用于显示柱状图,该渲染器能够很好的控制每个组(位于一个刻度值处的各个
分类)内及组间距离,并且该柱状图能够水平显示。
|--- cursor
相关引用包:<script type="text/javascript" src="../plugins/jqplot.cursor.min.js" /
该渲染器主要用于鼠标移动到图中时,鼠标在图中显示形式,常用与和高亮功能同时使用。
该渲染器相关引用包一旦引用到当前页面会,该渲染器立即生效。
|--- highlighter
相关引用包:<script type="text/javascript" src="../plugins/jqplot.highlighter.min.js" />
该渲染器主要用于当鼠标移动到图中数据点上时,在鼠标附近显示提示栏,并将相关信息显示
在提示栏。默认显示值是横纵坐标轴刻度值。当然,提示框中信息是可以根据自身需要定制的。
该渲染器相关引用包一旦引用到当前页面会,该渲染器立即生效。
|--- logAxisRenderer
相关引用包:<script type="text/javascript" src="../plugins/jqplot.logAxisRenderer.min.js" />
该渲染器主要用于以指数计算的方式生成坐标轴上刻度值。默认情况下,刻度值是均匀显示的,
但是刻度值也可以按指数增长的方式显示。
|--- ohlcRenderer
相关引用包:<script type="text/javascript" src="../plugins/jqplot.ohlcRenderer.min.js" />
该渲染器主要用于显示甘特图。通常情况下,该渲染器与dateAxisRenderer一起使用较多
|--- dragable
相关引用包:<script type="text/javascript" src="../plugins/jqplot.dragable.min.js" />
通过该渲染器,用户能够拖动某个数据点,jqplot会自动重画拖动后的新图表。同时,被拖动的
数据点的数据值也随着拖动发生变化。
|--- trendline
相关引用包:<script type="text/javascript" src="../plugins/jqplot.trendline.min.js" />
该渲染器主要用于对现有数据进行线性回归计算,并自动将计算结果以趋势线的形式展示出来,
当用户拖动某个数据点时,趋势线亦随用户拖动而变化。
|--- pointLabels
相关引用包:<script type="text/javascript" src="../plugins/jqplot.pointLabels.min.js" />
该渲染器主要用于将数据节点相关的的信息以标签的方式放于该数据节点附近;对于相应数据
为空的,其标签不显示。
相关推荐
jqplot
用JS作图形报表,有多个插件可选择,其中HighCharts、JqPlot、JsChart是使用比较多的,但HighCharts和JsChart只能用作个人使用、为了以后项目中能使用,很多人选择JqPlot(个人和商业都免费)。俺最近开发项目进要...
jqplot官方文档,包含所有的api。 居家旅行必备
官方jqplot chart 例子,非常丰富。应有尽有。。
jqplot插件的option对象属性的配置描述
没啥可描述的,就是用jqplot做的例子,无语了,这还有文字限制,一点都不自由。
jqPlot实际开发源代码例子30例。 jqPlot是 一款基于jquery类库的图标绘制插件。 兼容所有浏览器。 通过jqPlot可以再网页中绘制线状、柱状、饼状等多种样式图表。而且,jqPlot具有插件可扩展性 (Pluggability),你...
jqPlot图表中文API使用文档及源码和在线示例实例_所有属性详解
jqplot 是jquery 的一个插件主要是用于在网页上绘制图表 统计图
强大的Jquery图表绘制插件 —— jqPlot jqPlot是一款基于jquery类库的图标绘制插件。通过jqPlot可以再网页中绘制线状、柱状、饼状等多种样式图表。而且,jqPlot具有插件可扩展性(Pluggability),你可以编写自己的...
jqplot饼状统计图,很鲜明很简单的例子。如需其他图形只需改动小部分即可。
jqplot中文API帮助文档.pdf
jqplot 简易示例 ,没有数据交互,
jqplot柱状图示例,加鼠标移动,示例+JS
读取XML文件中的数据,解析后用jqplot曲线图的形式表示
一个通过jqplot完整的生成折线图和柱状图例子
非常好用的Jquery的画图插件-jqPlot。
运用jqplot能够画线图、饼图,效果优美,是一个很强大的jquery插件.
jqPlot是一个jQuery绘图插件,可以利用它制作漂亮的线状图、柱状图和饼图。jqPlot支持为图表设置各种不同的样式。提供Tooltips,数据点高亮显示等功能。主要功能包括[1]: 1、有多种图表样式可供选择 2、可以自定义...