几款免费的图表js插件（转）
1，ichartjs(国产)(http://www.ichartjs.com/) ===============强烈推荐
ichartjs是一款优秀的国产开源插件，作者是王鹤，英文名taylor，毕业于南昌大学软件工程专业。
ichartjs 是一款基于HTML5的图形库。使用纯javascript语言, 利用HTML5的canvas标签绘制各式图形。 ichartjs致力于为您的应用提供简单、直观、可交互的体验级图表组件。是WEB/APP图表展示方面的解决方案 。如果你正在开发HTML5的应用，ichartjs正好适合您。 ichartjs目前支持饼图、环形图、折线图、面积图、柱形图、条形图。ichartjs是基于Apache License 2.0协议的开源项目。
2，echarts(国产)(http://echarts.baidu.com/)
Echarts是百度前端团队做的基于html5-canvas的开源图表绘制组件。
几个特性如下：
拖拽重计算：拖拽重计算特性（专利）带来了数据统计图表从未有过的用户体验，允许用户对统计数据进行有效的提取、整合，甚至在多个图表间交换数据，赋予了用户对数据进行挖掘、整合的能力。
大 规模数据模式：如何展现成千上百万的数据？貌似除了用专业的统计工具（如MATLAB）外别无选择？不，在拥有众多交互特性下ECharts依然可以做到 直角系图表（折、柱、散点、K线）20万数据秒级出图。 值域漫游：基于坐标的图表（如地图、散点图）通过色彩变化表现数值的大小能直观形象的展示数据分布。但如何聚焦到我所关心的数值上？ECharts拥有值 域漫游的功能，让你可以轻松进行数值筛选
3，Chart.js(http://www.chartjs.org/)
小巧而轻便的的图表插件，缺点是支持的图形类型较少，数据交互功能也非常有限，但作者以后可能会逐渐完善。
10款免费而优秀的图表JS插件
4，HighChart.js(http://www.highcharts.com/)
5，Jqplot(http://www.jqplot.com/)
一个相当古老而“坚挺”的图表插件，支持现代浏览器和IE7，IE8（和LoongChart一样，抛弃IE6了）。
10款免费而优秀的图表JS插件
目前来说，可以在其中选择一两种完全可以满足我们的开发需求;
当然，还有我们最原始的方法:使用 jfreechart 生成 曲线、柱状图、饼状图、分布图 展示到JSP
局限性很大:例如只能展示在jsp页面，而且使用起来比较杂乱
给个例子:生成柱状图
package com.xidian.servlet;
import java.awt.Color;
import java.awt.Font;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.jfree.chart.ChartFactory;
import org.jfree.chart.ChartUtilities;
import org.jfree.chart.JFreeChart;
import org.jfree.chart.axis.CategoryAxis;
import org.jfree.chart.axis.NumberAxis;
import org.jfree.chart.plot.CategoryPlot;
import org.jfree.chart.plot.PlotOrientation;
import org.jfree.chart.renderer.category.BarRenderer;
import org.jfree.chart.title.TextTitle;
import org.jfree.data.category.DefaultCategoryDataset;
/**
* 生产柱状图
* @说明
* @author cuisuqiang
* @version 1.0
* @since
*/
@SuppressWarnings("serial")
public class PillarServlet extends HttpServlet {
@Override
protected void service(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/html");
// 使用普通数据集
DefaultCategoryDataset chartDate = new DefaultCategoryDataset();
// 增加测试数据，第一个参数是访问量，最后一个是时间，中间是显示用不考虑
chartDate.addValue(55, "访问量", "2010-01");
chartDate.addValue(65, "访问量", "2010-02");
chartDate.addValue(59, "访问量", "2010-03");
chartDate.addValue(156, "访问量", "2010-04");
chartDate.addValue(452, "访问量", "2010-05");
chartDate.addValue(359, "访问量", "2010-06");
try {
// 从数据库中获得数据集
DefaultCategoryDataset data = chartDate;
// 使用ChartFactory创建3D柱状图，不想使用3D，直接使用createBarChart
JFreeChart chart = ChartFactory.createBarChart3D(
"网站月访问量统计", // 图表标题
"时间", // 目录轴的显示标签
"访问量", // 数值轴的显示标签
data, // 数据集
PlotOrientation.VERTICAL, // 图表方向，此处为垂直方向
// PlotOrientation.HORIZONTAL, //图表方向，此处为水平方向
true, // 是否显示图例
true, // 是否生成工具
false // 是否生成URL链接
);
// 设置整个图片的背景色
chart.setBackgroundPaint(Color.PINK);
// 设置图片有边框
chart.setBorderVisible(true);
Font kfont = new Font("宋体", Font.PLAIN, 12); // 底部
Font titleFont = new Font("宋体", Font.BOLD, 25); // 图片标题
// 图片标题
chart.setTitle(new TextTitle(chart.getTitle().getText(), titleFont));
// 底部
chart.getLegend().setItemFont(kfont);
// 得到坐标设置字体解决乱码
CategoryPlot categoryplot = (CategoryPlot) chart.getPlot();
categoryplot.setDomainGridlinesVisible(true);
categoryplot.setRangeCrosshairVisible(true);
categoryplot.setRangeCrosshairPaint(Color.blue);
NumberAxis numberaxis = (NumberAxis) categoryplot.getRangeAxis();
numberaxis.setStandardTickUnits(NumberAxis.createIntegerTickUnits());
BarRenderer barrenderer = (BarRenderer) categoryplot.getRenderer();
barrenderer.setBaseItemLabelFont(new Font("宋体", Font.PLAIN, 12));
barrenderer.setSeriesItemLabelFont(1, new Font("宋体", Font.PLAIN, 12));
CategoryAxis domainAxis = categoryplot.getDomainAxis();
/*------设置X轴坐标上的文字-----------*/
domainAxis.setTickLabelFont(new Font("sans-serif", Font.PLAIN, 11));
/*------设置X轴的标题文字------------*/
domainAxis.setLabelFont(new Font("宋体", Font.PLAIN, 12));
/*------设置Y轴坐标上的文字-----------*/
numberaxis.setTickLabelFont(new Font("sans-serif", Font.PLAIN, 12));
/*------设置Y轴的标题文字------------*/
numberaxis.setLabelFont(new Font("宋体", Font.PLAIN, 12));
/*------这句代码解决了底部汉字乱码的问题-----------*/
chart.getLegend().setItemFont(new Font("宋体", Font.PLAIN, 12));
// 生成图片并输出
ChartUtilities.writeChartAsJPEG(response.getOutputStream(), 1.0f,
chart, 500, 300, null);
} catch (Exception e) {
e.printStackTrace();
}
}
}
由代码来看，远没有使用js插件来的方便
