1.首先是下载,open-flash-chart-1.9.7,jofc2-1.0-0.jar,xstream-1.3.1。把jar放置在项目的lib目录下;
2.chart3.jsp代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<html>
<head>
<script type="text/javascript" src="jss/swfobject.js"></script>
<script type="text/javascript" src="jss/json/json2.js"></script>
<script type="text/javascript">
swfobject.embedSWF(
"open-flash-chart.swf",
"my_chart",
"40%",
"40%",
"9.0.0",
"expressInstall.swf",
{"data-file":"<%=request.getContextPath()%>/ChartRenderServlet1?voteTime=12"},
{wmode:"transparent"});
</script>
</head>
<body>
<p>Hello World</p>
<div id="my_chart"></div>
</body>
</html>
3.servlet代码如下;
package com.ct10000.jx.web.company.servlet;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.*;
import java.util.*;
import jofc2.model.Chart;
import jofc2.model.elements.PieChart;
import jofc2.model.axis.Label;
import jofc2.model.axis.XAxis;
import jofc2.model.axis.YAxis;
import jofc2.model.elements.LineChart;
import jofc2.model.elements.BarChart;
import jofc2.model.elements.BarChart.Bar;
import jofc2.model.Text;
import jofc2.model.elements.StackedBarChart;
import org.openflashchart.Graph;
//import org.openflashchart.Bar;
public class ChartRenderServlet1 extends HttpServlet {
private static final long serialVersionUID = -7442075906889560871L;
public void init(){
System.out.println("init");
}
//flash取数据时,走的是doGet方法
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException {
String voteTime= request.getParameter("voteTime");
System.out.println("wxf_test parameter voteTime=:"+voteTime);
System.out.println("wxf_test in doGet()....enter here");
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException {
System.out.println("wxf_test_enter ChartRenderServlet1.........................!");
try{
/*PieChart pie = new PieChart();
pie.setFontSize(15);// 设置字体
pie.addSlice(200000000, " 实收费用 " );// 分类
pie.addSlice(60000000, " 欠费金额 " );
pie.addSlice(30000000, " 报停金额 " );
pie.addSlice(20000000, " 减免金额 " );
pie.setStartAngle(100);// 设置角度
pie.setAnimate( true );
// 设置颜色
pie.setColours( new String[] { "0x336699" , "0x88AACC" , "0x999933" ,
"0x666699" , "0xCC9933" , "0x006666" , "0x3399FF" , "0x993300" ,
"0xAAAA77" , "0x666666" , "0xFFCC66" , "0x6699CC" , "0x663366" ,
"0x9999CC" , "0xAAAAAA" , "0x669999" , "0xBBBB55" , "0xCC6600" ,
"0x9999FF" , "0x0066CC" , "0x99CCCC" , "0x999999" , "0xFFCC00" ,
"0x009999" , "0x99CC33" , "0xFF9900" , "0x999966" , "0x66CCCC" ,
"0x339966" , "0xCCCC33" });
pie.setTooltip( "#val# / #total#<br> 占百分之 #percent#");// 鼠标移动上去后提示内容
pie.setRadius(20);
Chart flashChart = new Chart( " 2009至2010年度 包烧费分析 " , "font-size:30px;color:#ff0000;" ); // 整个图的标题
//flashChart.setBackgroundColour("#3EFFFF");
flashChart.addElements(pie); // 把饼图加入到图表
String json = flashChart.toString();// 转成 json 格式
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().print(json);// 写到客户端*/ //已经测试成功
///条状图
/*BarChart chart = new BarChart(BarChart.Style. GLASS ); // 设置条状图样式
//FilledBarChart chart = new FilledBarChart("red","blue");// 设置条状图样式
//String sMax = "10000" ;
long max = 900; // //Y 轴最大值
Map<String,Long> map = new HashMap<String,Long>();
map.put( "5" , new Long(50));
map.put( "6" , new Long(45));
map.put( "7" , new Long(60));
map.put( "8" , new Long(30));
map.put( "9" , new Long(80));
map.put( "10" , new Long(500));
map.put( "11" , new Long(800));
map.put( "12" , new Long(200));
XAxis x = new XAxis(); // X 轴
int i = 5;
for (String key:map.keySet()){
x.addLabels(i+"月份"); // x 轴的文字
Bar bar = new Bar(map.get(""+i), " 万元 " );
i++;
bar.setColour( "0x336699" ); // 颜色
bar.setTooltip(map.get(""+i) + " 万元 " ); // 鼠标移动上去后的提示
chart.addBars(bar); // 条标题,显示在 x 轴上
}
Chart flashChart = new Chart();
flashChart.addElements(chart); // 把柱图加入到图表
YAxis y = new YAxis(); //y 轴
y.setMax(max+10.0); //y 轴最大值
y.setSteps(max/10*1.0); // 步进
flashChart.setYAxis(y);
flashChart.setXAxis(x);
String json = flashChart.toString();
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().print(json);// 写到客户端
*/
///条状图测试成功//
///以下是折线图///
/*LineChart lineChart = new LineChart();
lineChart.setFontSize(15);// 设置字体
lineChart.setTooltip("#val#%");//设置鼠标移到点上显示的内容
LineChart.Dot dot1 = new LineChart.Dot(70);//按照顺序设置各个点的值
LineChart.Dot dot2 = new LineChart.Dot(85);
LineChart.Dot dot3 = new LineChart.Dot(44);
LineChart.Dot dot4 = new LineChart.Dot(67);
LineChart.Dot dot5 = new LineChart.Dot(90);
LineChart.Dot dot6 = new LineChart.Dot(64);
LineChart.Dot dot7 = new LineChart.Dot(28);
LineChart.Dot dot8 = new LineChart.Dot(99);
lineChart.addDots(dot1);//按照顺序把点加入到图形中
lineChart.addDots(dot2);
lineChart.addDots(dot3);
lineChart.addDots(dot4);
lineChart.addDots(dot5);
lineChart.addDots(dot6);
lineChart.addDots(dot7);
lineChart.addDots(dot8);
XAxis x = new XAxis(); // X 轴
x.addLabels("5月份");
x.addLabels("6月份");
x.addLabels("7月份");
x.addLabels("8月份");
x.addLabels("9月份");
x.addLabels("10月份");
x.addLabels("11月份");
x.addLabels("12月份");
//x.setColour("0x000000");
long max = 100; // //Y 轴最大值
YAxis y = new YAxis(); //y 轴
y.setMax(max+0.0); //y 轴最大值
y.setSteps(10); // 步进
Chart flashChart = new Chart( " 历年收费率报表 " , "font-size:12px;color:#ff0000;" ); // 整个图的标题
flashChart.addElements(lineChart); // 把饼图加入到图表
Text yText = new Text("历年缴费率曲线图",Text.createStyle(20, "#736AFF", Text.TEXT_ALIGN_CENTER));
flashChart.setYAxis(y);
flashChart.setXAxis(x);
flashChart.setYLegend(yText);//设置y轴显示内容
String json = flashChart.toString();// 转成 json 格式
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().print(json);// 写到客户端
*/
///折线图///测试成功
///以下是组合柱状图已经测试成功了/
StackedBarChart chart = new StackedBarChart( ); // 设置组合柱状图
long max = 900; // //Y 轴最大值
Map<String,Long> map = new HashMap<String,Long>();
map.put( "5" , new Long(50));
map.put( "6" , new Long(45));
map.put( "7" , new Long(60));
map.put( "8" , new Long(30));
map.put( "9" , new Long(80));
map.put( "10" , new Long(500));
map.put( "11" , new Long(800));
map.put( "12" , new Long(200));
XAxis x = new XAxis(); // X 轴
x.set3D(0);
x.setColour("#909090");
x.setGridColour("#ADB5C7");
int i = 5;
for (String key:map.keySet()){
StackedBarChart.Stack stack = new StackedBarChart.Stack();//新建柱组
x.addLabels(i+"月份"); // x 轴的文字
StackedBarChart.StackValue stackValue = new StackedBarChart.StackValue(map.get(""+i),"0xff0000");//每组柱状图每个柱的设置
StackedBarChart.StackValue stackValue2 = new StackedBarChart.StackValue(i * 5 + 10,"#00ff00");
StackedBarChart.StackValue stackValue3 = new StackedBarChart.StackValue(i * 10 + 20,"#0000ff");
i++;
stack.addStackValues(stackValue);
stack.addStackValues(stackValue2);
stack.addStackValues(stackValue3);
chart.addStack(stack); // 条标题,显示在 x 轴上
}
StackedBarChart.Key key1 = new StackedBarChart.Key("0xFF0000","包烧费",10);
StackedBarChart.Key key2 = new StackedBarChart.Key("#00ff00","热表收费",10);
StackedBarChart.Key key3 = new StackedBarChart.Key("#0000ff","生活热水收费",10);//在图的上面显示,起到提示作用
chart.addKeys(key1);
chart.addKeys(key2);
chart.addKeys(key3);
Chart flashChart = new Chart("组合柱状图","{font-size:20px; color: #FFFFFF; margin: 5px; background-color: #505050; padding:5px; padding-left: 20px; padding-right: 20px;}");
flashChart.addElements(chart); // 把柱图加入到图表
YAxis y = new YAxis(); //y 轴
y.set3D(0);
y.setColour("#909090");
y.setGridColour("#ADB5C7");
y.setMax(max+100.0); //y 轴最大值
y.setSteps(max/10*1.0); // 步进 90图上可以看出
flashChart.setYAxis(y);
flashChart.setXAxis(x);
Text text = new Text("Open Flash Chart 3D Bar");
text.setStyle(Text.createStyle(15, "#736AFF", Text.TEXT_ALIGN_RIGHT));
flashChart.setYLegend(text);//设置Y轴左侧的文字
String json = flashChart.toString();
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().print(json);// 写到客户端
}catch(Exception ex){
ex.printStackTrace();
}
}
}