JFreeChart展示柱状图和折线图的组合
笔者最近工作需要在Web前端展示统计图表(基于SSH架构),使用了JFreeChart和amchart两个控件,谈谈使用心得。JFreeChart的最大好处是可以在Server端保存jpg图片,并且前端代码简单,各浏览器兼容性好,但是相对来说动态展示效果较差。Amchart则可以更好的展示动态性,但是缺点也很明显,前端代码复杂,不能保存server端图片。另外,chrome和ff中对其支持较好,所需显示时间很短(2s左右),但是在ie8中需要30s以上时间(9张图表)。
JFreeChart前端代码简洁明了,中端API详尽,代码如下:
[javascript]
//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();
}
});
});
<pre name="code" class="java"> //2.前端form中的显示,只需两行代码,可嵌入到相应的table或者div中:
<label id="testImgError"></label>
<img id="testImg" width=500 height=270 border=0></pre>
<pre></pre>
<pre name="code" class="java"> //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//易做图IrrByYear";
File newPath = new File(path1);
if (!newPath.exists())
newPath.mkdir();
File tempFile1 = File.createTempFile(prefix, ".jpeg", newPath);
ChartUtilities.saveChartAsJPEG(tempFile1, demo, 500, 270);//实际JFreeChart保存图片方法
//向前台传递Json
sendJSON(distributed);
}</pre><pre name="code" class="java"> //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>());
else
map.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;
else
tempSum = Double.parseDouble(mm.get("amount").toString());
补充:web前端 , JavaScript ,