java 免费图表控件_转：几款免费的图表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插件

目前来说，可以在其中选择一两种完全可以满足我们的开发需求;

局限性很大:例如只能展示在jsp页面，而且使用起来比较杂乱

给个例子:生成柱状图

packagecom.xidian.servlet;importjava.awt.Color;importjava.awt.Font;importjava.io.IOException;importjavax.servlet.ServletException;importjavax.servlet.http.HttpServlet;importjavax.servlet.http.HttpServletRequest;importjavax.servlet.http.HttpServletResponse;importorg.jfree.chart.ChartFactory;importorg.jfree.chart.ChartUtilities;importorg.jfree.chart.JFreeChart;importorg.jfree.chart.axis.CategoryAxis;importorg.jfree.chart.axis.NumberAxis;importorg.jfree.chart.plot.CategoryPlot;importorg.jfree.chart.plot.PlotOrientation;importorg.jfree.chart.renderer.category.BarRenderer;importorg.jfree.chart.title.TextTitle;importorg.jfree.data.category.DefaultCategoryDataset;/*** 生产柱状图

* @说明

*@authorcuisuqiang

*@version1.0

*@since

*/@SuppressWarnings("serial")public class PillarServlet extendsHttpServlet {

@Overrideprotected voidservice(HttpServletRequest request,

HttpServletResponse response)throwsServletException, IOException {

response.setContentType("text/html");//使用普通数据集

DefaultCategoryDataset chartDate = newDefaultCategoryDataset();//增加测试数据，第一个参数是访问量，最后一个是时间，中间是显示用不考虑

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(newTextTitle(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插件来的方便