jQuery 数据展现—折线图、饼图、柱状图、仪表盘

原文：http://poster469.blog.163.com/blog/static/1319113420131060244321/

百度ECharts：http://echarts.baidu.com/

 

Google Charts : https://developers.google.com/chart/interactive/docs/gallery/bubblechart?hl=zh-CN 

 

highcharts : http://www.highcharts.com

效果图：http://www.highcharts.com/demo/bar-basic/grid

Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表，并且免费提供给个人学习、个人网站和非商业用途使用。目前HighCharts支持的图表类型有曲线图、区域图、柱状图、饼状图、散状点图和综合图表。

 

HighCharts界面美观，由于使用JavaScript编写，所以不需要像Flash和Java那样需要插件才可以运行，而且运行速度快。另外HighCharts还有很好的兼容性，能够完美支持当前大多数浏览器。现在官方的最新版本为Highcharts-3.0.6。

 

Highcharts是一个制作图表的纯Javascript类库，主要特性如下：

• 兼容性：兼容当今所有的浏览器，包括iPhone、IE和火狐等等；
• 对个人用户完全免费；
• 纯JS，无BS；
• 支持大部分的图表类型：直线图，曲线图、区域图、区域曲线图、柱状图、饼装图、散布图；
• 跨语言：不管是PHP、Asp.net还是Java都可以使用，它只需要三个文件：一个是Highcharts的核心文件highcharts.js，还有a canvas emulator for IE和Jquery类库或者MooTools类库；
• 提示功能：鼠标移动到图表的某一点上有提示信息；
• 放大功能：选中图表部分放大，近距离观察图表；
• 易用性：无需要特殊的开发技能，只需要设置一下选项就可以制作适合自己的图表；
• 时间轴：可以精确到毫秒；

在 RunJS 查看在线演示：http://runjs.cn/code/ih5xzoeb

jqplot : http://www.jqplot.com

    简介jqPlot是一个jQuery绘图插件，可以利用它制作漂亮的线状图、柱状图和饼图。jqPlot支持为图表设置各种不同的样式。提供Tooltips，数据点高亮显。实例：http://www.jqplot.com/tests/line-charts.php

refer

1 http://blog.360converter.com/archives/1095

2 9 个基于JavaScript 和 CSS 的 Web 图表框架  http://www.cnbeta.com/articles/79418.htm

3 http://www.cnblogs.com/fdszlzl/archive/2009/06/20/1507371.html