Open Flash Chart使用例子

Flash图表分析在Java中的使用.

package com.sf.module.ordercharts.action;

import java.util.ArrayList;
import java.util.List;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;
import com.sf.module.ordercharts.biz.IOrderControlBiz;
import com.sf.module.ordercharts.domain.OrderControl;

import jofc2.model.Chart;
import jofc2.model.axis.Label;
import jofc2.model.axis.XAxis;
import jofc2.model.axis.YAxis;
import jofc2.model.elements.BarChart;
import jofc2.model.elements.PieChart;
import jofc2.model.elements.BarChart.Bar;

@SuppressWarnings("serial")
public class OrderControlFlashAction extends ActionSupport {

	private IOrderControlBiz orderControlBiz;

	private Chart ofcChart;

	public Chart getOfcChart() {
		return ofcChart;
	}

	/**
	 * 饼图
	 * @return
	 * @throws Exception
	 */
	public String showPieChart() throws Exception {
		// x轴数据集合-浏览器类型
		List<Label> xLabel = new ArrayList<Label>();
		// 获取需要显示的数据集
		List<Number> dataSet = new ArrayList<Number>();  
		
		OrderControl orderControl = orderControlBiz.findDataInfo(warehouseId,
				companyId);
		if (orderControl == null) {
			orderControl = new OrderControl();
			orderControl.setData1(0);
			orderControl.setData2(0);
			orderControl.setData3(0);
			orderControl.setData4(0);
			orderControl.setData5(0);
		} else {
			if (orderControl.getData1() == null) {
				orderControl.setData1(0);
			}
			if (orderControl.getData2() == null) {
				orderControl.setData2(0);
			}
			if (orderControl.getData3() == null) {
				orderControl.setData3(0);
			}
			if (orderControl.getData4() == null) {
				orderControl.setData4(0);
			}
			if (orderControl.getData5() == null) {
				orderControl.setData5(0);
			}
		}

		// 填充x轴
		dataSet.add(orderControl.getData1());
		dataSet.add(orderControl.getData2());
		dataSet.add(orderControl.getData3());
		dataSet.add(orderControl.getData4());
		dataSet.add(orderControl.getData5());
		
		// 填充y轴
		xLabel.add(new Label("未执行"));
		xLabel.add(new Label("正在拣货"));
		xLabel.add(new Label("正在包装"));
		xLabel.add(new Label("正在发运"));
		xLabel.add(new Label("执行完成"));
		
		// 设置X轴内容
		XAxis labels = new XAxis();
		labels.addLabels(xLabel);
		// 设置Y轴显示值域:Range的三个参数含义为：坐标最小值，最大值和步进值
		YAxis range = new YAxis();
		range.setRange(0, 200, 10);
		

		//饼状图  
		PieChart pieChart = new PieChart();  
		
		pieChart.addSlice(orderControl.getData1(), "未执行");
		pieChart.addSlice(orderControl.getData2(), "正在拣货");
		pieChart.addSlice(orderControl.getData3(), "正在包装");
		pieChart.addSlice(orderControl.getData4(), "正在发运");
		pieChart.addSlice(orderControl.getData5(), "执行完成");
		
		//饼状图设置  "#FA5E1F", "#FDCB3F", "#71D743", "#D23333", "#BAE73F"
		pieChart.setColours("#d01f3c", "#356aa0", "#C79810", "#BAE73F", "#FDCB3F");  
		pieChart.setText("操作数量");  
		pieChart.setRadius(180); //饼图的半径  
		//pieChart.setTooltip("#val# 个 #total#<br>#percent#");   
		pieChart.setTooltip("#val# 个<br>占比#percent#");   

		// 图表设置
		Chart chart = new Chart("订单监控");
		chart.setXAxis(labels);
		chart.setYAxis(range);
		chart.addElements(pieChart);
		
		// 打印JSON格式的文本
		//System.out.print(chart.toString());
		HttpServletResponse response = ServletActionContext.getResponse();
		response.setContentType("application/json-rpc;charset=utf-8");
		response.setHeader("Cache-Control", "no-cache");
		response.setHeader("Expires", "0");
		response.setHeader("Pragma", "No-cache");
		response.getWriter().write(chart.toString());
		return null;
	}
	
	public String showBarChart() throws Exception {
		// x轴数据集合-浏览器类型
		List<Label> xLabel = new ArrayList<Label>();
		// 获取需要显示的数据集
		List<Bar> barList = new ArrayList<Bar>();

		OrderControl orderControl = orderControlBiz.findDataInfo(warehouseId,
				companyId);
		if (orderControl == null) {
			orderControl = new OrderControl();
			orderControl.setData1(0);
			orderControl.setData2(0);
			orderControl.setData3(0);
			orderControl.setData4(0);
			orderControl.setData5(0);
		} else {
			if (orderControl.getData1() == null) {
				orderControl.setData1(0);
			}
			if (orderControl.getData2() == null) {
				orderControl.setData2(0);
			}
			if (orderControl.getData3() == null) {
				orderControl.setData3(0);
			}
			if (orderControl.getData4() == null) {
				orderControl.setData4(0);
			}
			if (orderControl.getData5() == null) {
				orderControl.setData5(0);
			}
		}

		// 填充x轴
		barList.add(new Bar(orderControl.getData1()).setTooltip("#val# 个"));
		barList.add(new Bar(orderControl.getData2()).setTooltip("#val# 个"));
		barList.add(new Bar(orderControl.getData3()).setTooltip("#val# 个"));
		barList.add(new Bar(orderControl.getData4()).setTooltip("#val# 个"));
		barList.add(new Bar(orderControl.getData5()).setTooltip("#val# 个"));
		
		
		// 填充y轴
		xLabel.add(new Label("未执行"));
		xLabel.add(new Label("正在拣货"));
		xLabel.add(new Label("正在包装"));
		xLabel.add(new Label("正在发运"));
		xLabel.add(new Label("执行完成"));
		// }
		// 设置X轴内容
		XAxis labels = new XAxis();
		labels.addLabels(xLabel);
		// 设置Y轴显示值域:Range的三个参数含义为：坐标最小值，最大值和步进值
		YAxis range = new YAxis();
		//range.setRange(0, 50, 5);

		// 柱状图设置
		BarChart barChart = new BarChart(BarChart.Style.GLASS);
		barChart.addBars(barList);
		barChart.setColour("#6666FF");

		// 图表设置
		Chart chart = new Chart("操作类型");
		chart.setXAxis(labels);
		chart.setYAxis(range);
		chart.addElements(barChart);
		
		// 打印JSON格式的文本
		//System.out.print(chart.toString());
		HttpServletResponse response = ServletActionContext.getResponse();
		response.setContentType("application/json-rpc;charset=utf-8");
		response.setHeader("Cache-Control", "no-cache");
		response.setHeader("Expires", "0");
		response.setHeader("Pragma", "No-cache");
		response.getWriter().write(chart.toString());
		return null;
	}

	public void setOrderControlBiz(IOrderControlBiz orderControlBiz) {
		this.orderControlBiz = orderControlBiz;
	}

	private Long companyId;
	private Long warehouseId;

	public void setCompanyId(Long companyId) {
		this.companyId = companyId;
	}

	public void setWarehouseId(Long warehouseId) {
		this.warehouseId = warehouseId;
	}

}

struts2 XML配置

<action name="showPieChart"
class="com.sf.module.ordercharts.action.orderControlFlashAction" method="showPieChart">
</action>
		
<action name="showBarChart"
class="com.sf.module.ordercharts.action.orderControlFlashAction" method="showBarChart">
</action>

JSP中我用ExtJS,写个panel显示

				chartPanel = new Ext.Panel({
				    	border:false,
				    	autoScroll: true,
				    	region:"center",
				        html: '<center><br/><br/><br/>'+
				        	'<div id="showBarChart"></div>  '+
				        	'<div id="showPieChart"></div>'+
				        '</center>'
				    });

	task_state = {
	        run: checkLogin,	//执行任务时执行的函数
	        interval: minute * 60 * 1000		//任务间隔，毫秒为单位，这里是10秒
	    }
		
		function checkLogin(warehouseId,companyId){
			var warehouseId = Ext.getCmp('comboid').getValue();
			var companyId = Ext.getCmp('companyid').getValue();
			showBarChart(warehouseId,companyId);
			showPieChart(warehouseId,companyId);
	   	}
	   	
	   	function showBarChart(warehouseId,companyId){
	   		var flashvars = {"data-file":"showBarChart.action?warehouseId="+warehouseId+"&companyId="+companyId};  
    		var params = {
    					menu: "false",scale: "noScale",wmode:"opaque"
    				};  
    		swfobject.embedSWF(
    			"${scripts}/open-flash-chart.swf", 
    			"showBarChart", "600px", "400px", 
    			"9.0.0",  
    			"expressInstall.swf",flashvars,params
    			);  
	   	}
	   	
	   	function showPieChart(warehouseId,companyId){
	   		var flashvars = {"data-file":"showPieChart.action?warehouseId="+warehouseId+"&companyId="+companyId};  
    		var params = {
    					menu: "false",scale: "noScale",wmode:"opaque"
    				};  
    		swfobject.embedSWF(
    			"${scripts}/open-flash-chart.swf", 
    			"showPieChart", "600px", "400px", 
    			"9.0.0",  
    			"expressInstall.swf",flashvars,params
    			);  
	   	}

图片

使用的JAR包

xstream-1.3.1.jar

jofc2-1.0-0.jar