JFreeChart展示柱状图和折线图的组合

笔者最近工作需要在Web前端展示统计图表（基于SSH架构），使用了JFreeChart和amchart两个控件，谈谈使用心得。
JFreeChart的最大好处是可以在Server端保存jpg图片，并且前端代码简单，各浏览器兼容性好，但是相对来说动态展示效果较差。Amchart则可以更好的展示动态性，但是缺点也很明显，前端代码复杂，不能保存server端图片。另外，chrome和ff中对其支持较好，所需显示时间很短（2s左右），但是在ie8中需要30s以上时间（9张图表）。
JFreeChart前端代码简洁明了，中端API详尽，代码如下：

    //1.jquery调用ajax请求$(document).ready(function() {$.ajax({type: "POST",url: "需要调用的url链接",beforeSend :function() {//调用成功前前端显示内容$("#testImgError").text("正在获取...");//可使用动态gif图片展示等待过程},success: function(data) {//调用成功后前端处理$("#testImgError").text("");                    $("#testImg").attr("src", "../test/"+data);},error: function() {//前端调用错误处理$("#testImgError").text("调用失败");$("#testImg").hide();}});            });

    //2.前端form中的显示，只需两行代码，可嵌入到相应的table或者div中：<label id="testImgError"></label><img id="testImg" width=500 height=270 border=0>

    //3.中后端的代码也不复杂，需要处理一下数据获取和图片的保存和发送过程，代码如下：//3.1.数据获取public void createTestImg() throws IOException {//获取参数， id不能为空Integer id = Integer.parseInt(this.getRequest().getParameter("id"));//根据id获取数据        List distributed = testService.getData(id);ChartConstruction mtd = new ChartConstruction("");JFreeChart demo = mtd.getTestChart(distributed);//保存为图片，创建所需保存图片的文件夹String prefix = "InvestTypeDistributed-";String path1 = "D://Chart//paperIrrByYear";File newPath = new File(path1);if (!newPath.exists())newPath.mkdir();File tempFile1 = File.createTempFile(prefix, ".jpeg", newPath);ChartUtilities.saveChartAsJPEG(tempFile1, demo, 500, 270);//实际JFreeChart保存图片方法//向前台传递JsonsendJSON(distributed);}

    //3.2.向前台发送Json，方法多种多样，大家可以根据需要自行编写private void sendJSON(List distributed){Map<String, Object> map = new HashMap<String, Object>();if ((distributed == null) || (distributed.size() == 0))map.put("rows", new ArrayList<Object>());elsemap.put("rows", distributed);senderJson(this.getResponse(), map);}//3.3组织数据，两个dataset，形成柱状图和折线图的组合public JFreeChart getTestChart(List distributed, Integer companyId, String begin, String end){//List distributed = peCompanyInvestAnalysisService.getCompanyMoneyTypeDistributed(companyId, begin, end);DefaultCategoryDataset datasetSum = new DefaultCategoryDataset();DefaultCategoryDataset datasetNum = new DefaultCategoryDataset();Double maxSum = 0.0d;Double minSum = 0.0d;Double tempSum = 0.0d;Integer maxNum = 0;Integer minNum = 0;Integer tempNum = 0;if(distributed!=null)for(int i=0;i<distributed.size();i++){Map mm=(Map)distributed.get(i);if(mm.get("amount")==null)tempSum = 0.0d;elsetempSum = Double.parseDouble(mm.get("amount").toString());if(mm.get("num")==null)tempNum = 0;elsetempNum = Integer.parseInt(mm.get("num").toString());if(tempNum==null)tempNum = 0;datasetSum.addValue(tempSum, "投资币种", mm.get("moneyType").toString());datasetNum.addValue(tempNum,"投资项目数",mm.get("moneyType").toString());}JFreeChart chart = creatChart("投资币种分布图",datasetSum,datasetNum);return chart;}//3.4调用JFreeChart的api，创建图片样式private JFreeChart creatChart(String title, DefaultCategoryDataset datasetSum, DefaultCategoryDataset datasetNum){//创建主题样式StandardChartTheme standardChartTheme=new StandardChartTheme("CN");standardChartTheme.setExtraLargeFont(new Font("黑体",Font.BOLD,15)); //设置标题字体standardChartTheme.setRegularFont(new Font("宋书",Font.PLAIN,12));//设置图例的字体standardChartTheme.setLargeFont(new Font("宋书",Font.PLAIN,12));//设置轴向的字体ChartFactory.setChartTheme(standardChartTheme);//应用主题样式JFreeChart chart = ChartFactory.createBarChart(title, // chart title"", // x轴标题，domain axis label"", // y轴标题，range axis labeldatasetSum, // dataPlotOrientation.VERTICAL, // orientationfalse, // include legendtrue, // tooltips?false // URLs?);chart.setBackgroundPaint(Color.white);CategoryPlot plot = (CategoryPlot) chart.getPlot();CategoryDataset categorydataset = datasetNum;       //设置第二个数据集plot.setDataset(1, categorydataset);plot.mapDatasetToRangeAxis(1, 1);plot.setBackgroundPaint(Color.white);plot.setRangeGridlinePaint(Color.white);plot.setOutlinePaint(Color.white);  //设置图片边框颜色，去掉边框//柱体的样式设计BarRenderer renderer = (BarRenderer) plot.getRenderer();renderer.setSeriesPaint(0, Color.orange);renderer.setDrawBarOutline(false);//设置柱顶数据,API中居然没有StandardCategoryItemLabelGenerator这个类renderer.setItemLabelGenerator(new StandardCategoryItemLabelGenerator());renderer.setSeriesItemLabelsVisible(0, true);//防止由于柱体太少而动态增加柱体宽度（JFreeChart默认是根据柱体多少而显示柱体宽度的）int k = datasetSum.getColumnCount();if (k == 1) {plot.getDomainAxis().setLowerMargin(0.26);plot.getDomainAxis().setUpperMargin(0.66);} else if (k < 6) {double margin = (1.0 - k * 0.08) / 3;plot.getDomainAxis().setLowerMargin(margin);plot.getDomainAxis().setUpperMargin(margin);((BarRenderer) plot.getRenderer()).setItemMargin(margin);} else {((BarRenderer) plot.getRenderer()).setItemMargin(0.1);}/*------设置Y轴----*/double unit=1d;//刻度的长度//右边Y轴，相关属性设置NumberAxis numberaxis1 = new NumberAxis("");unit=Math.floor(10);//刻度的长度NumberTickUnit ntu= new NumberTickUnit(unit);numberaxis1.setTickUnit(ntu);numberaxis1.setRange(0,100);//刻度范围plot.setRangeAxis(1, numberaxis1);//左边Y轴NumberAxis numberaxis = (NumberAxis) plot.getRangeAxis();numberaxis .setAutoTickUnitSelection(false);        numberaxis.setRange(0.0, 100.0);//刻度的范围ntu= new NumberTickUnit(unit);numberaxis .setTickUnit(ntu);/*------设置柱状体与图片边框的上下间距---*/numberaxis.setUpperMargin(0.05);numberaxis.setLowerMargin(0.05);/*------设置X轴----*/CategoryAxis domainAxis = plot.getDomainAxis();domainAxis.setCategoryLabelPositions(CategoryLabelPositions.STANDARD);/*------设置X轴标题的倾斜程度----*/domainAxis.setCategoryLabelPositions(CategoryLabelPositions.createUpRotationLabelPositions(Math.PI / 6.0));/*------设置柱状体与图片边框的左右间距--*///domainAxis.setLowerMargin(0.01);//domainAxis.setUpperMargin(0.01);//设置折线图的样式LineAndShapeRenderer lineandshaperenderer = new LineAndShapeRenderer();lineandshaperenderer.setBaseItemLabelGenerator(new StandardCategoryItemLabelGenerator());lineandshaperenderer.setBaseItemLabelsVisible(true);lineandshaperenderer.setBaseItemLabelFont(new Font("隶书", Font.BOLD, 10));plot.setRenderer(1, lineandshaperenderer);plot.setDatasetRenderingOrder(DatasetRenderingOrder.FORWARD);//图例1声明及相关样式设置LegendTitle legendtitle = new LegendTitle(plot.getRenderer(0));//图例2声明及相关样式设置LegendTitle legendtitle1 = new LegendTitle(plot.getRenderer(1));BlockContainer blockcontainer = new BlockContainer(new BorderArrangement());blockcontainer.add(legendtitle, RectangleEdge.LEFT);blockcontainer.add(legendtitle1, RectangleEdge.RIGHT);blockcontainer.add(new EmptyBlock(20D, 0.0D));CompositeTitle compositetitle = new CompositeTitle(blockcontainer);compositetitle.setPosition(RectangleEdge.BOTTOM);chart.addSubtitle(compositetitle);chart.setAntiAlias(false);chart.getRenderingHints().put(RenderingHints.KEY_TEXT_ANTIALIASING, RenderingHints.VALUE_TEXT_ANTIALIAS_OFF);return chart;}

JFreeChart展示柱状图和折线图的组合相关推荐

java使用poi操作world生成饼图，柱状图，折线图，组合图：二
java使用poi操作world生成饼图,柱状图,折线图,组合图:二上文和问题链接直接上代码 maven 测试类:单图表(入口) 测试类:组合图表(入口) 工具类:组合数据类工具类:枚举解析图表 ...
java使用poi操作world生成饼图，柱状图，折线图，组合图：一
java使用poi操作world生成饼图,柱状图,折线图,组合图:一下文和问题链接开发前准备准备模板模板下载地址百度云盘:cvod 本文可用操作组合图操作模板效果对比填充后的效果饼图模 ...
python 柱状图和折线图放在一起_Python matplotlib：matplotlib绘制——柱状图和折线图的组合...
Python matplotlib:使用matplotlib绘制--柱状图和折线图的组合. 废话不多说,直接上效果图和代码. 代码如下: #柱状图 import numpy as np import ...
php 柱状折线组合,柱状图和折线图组合怎么用
在Excel中,有时候单一的图表类型无法满足数据的多元化展示,这时就要考虑多种图表的组合,所以本文就以柱状图和折线图的组合为例,介绍一下组合图表的制作方法. 在下图中,以年份为横坐标,营业收入用柱状图 ...
python实现柱状图和折线图组合图（通过读取文件实现）
前言相信很多初学python可视化小伙伴会有这样的疑问,怎么画柱状图和折线图的组合图呢?自己会画柱状图.折线图,但是怎么画在一起呢?其实啊,这也不难,下面给大家演示一波. 目录前言一.数据源(数 ...
java使用poi在word中生成柱状图、折线图、饼图、柱状图+折线图组合图、动态表格、文本替换、图片替换 springboot项目
本文参考地址:https://blog.csdn.net/u014427811/article/details/100771314 在参考文章的基础上,增加了模板样例模板样例地址百度网盘链接:h ...
Java通过JfreeChart生成转Base64图片字符串（饼图、折线图、柱状图、折线图-多条、3D柱状图、气泡图、时序图、曲线图、区域图、分布图、联合分类图、双X轴图、K线图、柱状图-横向等图)
工具类 CreatLineChart.java package DrawLine;import java.awt.BasicStroke; import java.awt.Color; import ...
POI导出excel+JFreeChart生成图表（柱状图和折线图）
根据查询的数据生成excel和图表,excel并且支持分页,这次分页的方法和上一篇文章的方法不同,这次的方法是在查询出数据的时候就开始设置了,在将查询结果写到list集合的时候就分多个集合在存储,最后 ...
java使用poi在word中生成柱状图、折线图、饼图、柱状图+折线图组合图、动态表格、文本替换、图片替换、更新内置Excel数据、更新插入的文本框内容、合并表格单元格；
本文参考地址:https://blog.csdn.net/wangxiaoyingWXY/article/details/95377533 在参考文章的基础上,增加了扩展.感谢被参考的妹子.另外该博客 ...

JFreeChart展示柱状图和折线图的组合

JFreeChart展示柱状图和折线图的组合相关推荐

最新文章

热门文章