`

【转】 JOFC2 - Java API for Open Flash Chart Version-2

JavaFlashjsonCacheJavaScript 
阅读更多
【转】 JOFC2 - Java API for Open Flash Chart Version-2
2010-06-03 15:41
转载自 shaxin1981
最终编辑 JavaGril
      最近在用Open Flash Chart做报表，在网上查了很多关于Open Flash Chart2的资料，可惜的是中文资料很少。现在自己开始开发基于Struts 1的Open Flash Chart开发，准备在我的空间里把JOFC2中针对的各个图表的用法写出来，给大家做个借鉴

首先下载JOFC2的jar包，可以在http://code.google.com/p/jofc2/下载到，另外还有一个开发人员针对jofc2自己的扩展可以在http://ci.pentaho.com/job/JOFC2/下载到，以下代码我用到的包是前者。下面我们开始我们的jofc之旅....

一.jsp的写法:

<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<html>
<head>

<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript" src="js/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()%>/testAction.do"},
{wmode:"transparent"});
</script>

</head>
<body>
<p>Hello World</p>
<div id="my_chart"></div>
</body>
</html>




其中<%=request.getContextPath()%>/testAction.do就是指定的我们的Action的路径。

二.Struts Action:

以下代码是Struts1 Action中的execute的写法

1)PieChart 饼图:

public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
// TODO Auto-generated method stub

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);// 写到客户端

}catch(Exception ex){
ex.printStackTrace();
}
return null;
}

显示效果如下：




2)BarChart 柱状图:

try{

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);// 写到客户端

}catch(Exception ex){
ex.printStackTrace();
}

return null;
}

显示效果如下：



2)LineChart 折线图:

public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
// TODO Auto-generated method stub

try{

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);// 写到客户端

}catch(Exception ex){
ex.printStackTrace();
}

return null;
}

显示效果如下：



4)BarChart2 组合柱状图:
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
// TODO Auto-generated method stub

try{

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),"0x336699");//每组柱状图每个柱的设置
StackedBarChart.StackValue stackValue2 = new StackedBarChart.StackValue(i * 5 + 10,"#3334AD");
StackedBarChart.StackValue stackValue3 = new StackedBarChart.StackValue(i * 10 + 20,"#D54C78");

i++;

stack.addStackValues(stackValue);
stack.addStackValues(stackValue2);
stack.addStackValues(stackValue3);

chart.addStack(stack); // 条标题，显示在 x 轴上

}


StackedBarChart.Key key1 = new StackedBarChart.Key("0x336699","包烧费",10);
StackedBarChart.Key key2 = new StackedBarChart.Key("#3334AD","热表收费",10);
StackedBarChart.Key key3 = new StackedBarChart.Key("#D54C78","生活热水收费",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+10.0); //y 轴最大值  

y.setSteps(max/10*1.0); // 步进  

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();
}

return null;
}

显示效果如下图
分享到：
| Brio开发规范
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    AJOFC -- Another Java API for Open Flash Chart 2

    AJOFC -- stands for "Another Java API for Open Flash Chart 2" 这是OFC2的Java语言库，使用很简单；想必用过OFC的朋友都知道JOFC或者OFCJ吧！它们是使用OFC常用的Java语言库，我用的也是JOFC2，但JOFC2对OFC2的...

    jofc2-1.0-0.zip

    在这个压缩包"jofc2-1.0-0.zip"中，包含的是Open Flash Chart的Java版本开发包，适用于那些希望通过Java语言在Web应用中生成动态图表的开发者。 首先，核心组件`jofc2-1.0-0.jar`是这个开发包的核心部分，它包含了...

    jofc2+open-flash-chart-SimplifiedChinese.swf

    《深入解析jofc2与Open-Flash-Chart：打造中文图表展示的高效方案》 在数字信息时代，数据可视化成为传递复杂信息的关键手段。jofc2与Open-Flash-Chart是两个强大的图表库，它们能帮助开发者创建出美观且功能丰富的...

    jofc2-TRUNK-SNAPSHOT

    它可能是Java Open Financial Connector 2的简写，这是一个假设，因为“jofc”通常与金融领域相关的开源项目关联，而“2”可能表示这是该项目的第二个主要版本。 标签“jofc2-TRUNK-SNAPSHOT”再次强调了这个项目的...

    Open Flash Chart的应用(java)，就是很炫的报表了

    这里面有两个java代码工程和 Open Flash Chart API。工程都是调试过的直接导入可用，代码都有详细的注释，如果你真是想用到报表之类的东西，肯定很不错了。 工程所需的jar 包 js文件都有，基本上很全。 第一步：...

    jofc2.rar_flash_flash open char_java open flash char_jofc json_o

    标题中的“jofc2.rar_flash_flash open char_java open flash char_jofc json_o”暗示了这个压缩包可能包含一个名为“jofc2”的项目，该项目与Flash开放图表（Flash Open Chart）有关，同时也涉及到Java对Flash图表...

    Open Flash Chart2 相关资料

    由于最近公司项目中要...3.Open Flash Chart2 Java中所需的扩展Jofc2最新版本； 4.Open Flash Chart2的基础入门教程。 (压缩包中的jofc版本可能有点旧，有些部分功能没有，请下载最新的jofc) 附最新jofc下载地址： ...

    open flash chart 2 使用

    - **jofc2**：源自 Google Code 的项目，可能是 Java 版本的 Open Flash Chart 2 的另一种实现。 ### 6. **最佳实践** - **性能优化**：避免一次性加载大量数据，考虑分页或动态加载。 - **响应式设计**：确保图表...

    jofc2.jar,jofc2-1.0-0.jar

    如果你找了 你懂的。。 ofc必备啊！ofc必备啊！ofc必备啊！

    java Open Flash Chart2生成曲线图

    Java Open Flash Chart 2（简称jOFC2）是一个基于Java的开源库，用于生成高质量的Flash图表，包括曲线图。这个库允许开发者在Java应用中轻松地创建动态、交互式的图表，为数据可视化提供了便利。在Java项目中集成...

    jofc2 的源代码

    例如，如果“jofc2”代表“Java Object Format Codec Version 2”，那么它可能是一个用于数据编码解码的库，专注于处理Java对象的序列化和反序列化。 深入源代码，我们首先需要关注的是主入口点，这可能是名为...

    Open_flash_chart_2相关资料（全）

    2. `jofc2-1.0-0.jar`：这是Open Flash Chart 2的核心库文件，包含了所有必要的类和方法，用于生成图表配置、处理数据和生成最终的SWF图表。开发者可以通过调用这个库中的API来定制图表的各种属性，如颜色、类型、...

    ofc_java学习资料

    【Java API for Open Flash Chart (JOFC2)】 JOFC2是专门为Java开发者设计的一个接口，它允许在Java Web应用中集成Open-Flash-Chart。JOFC2提供了对Open Flash Chart的全面支持，包括Struts 1框架的集成。通过JOFC2...

    OFC图表上显示每个节点的数值

    OFC（Open Flash Chart）是一款开源的Flash图表库，而jOfc2是其Java版本，允许开发者在Web应用中创建丰富的交互式图表。本文将深入探讨如何利用OFC2和jOfc2在图表上显示每个节点的数值，提高数据可读性。 首先，...

    jocf2jar包源码

    jofc2，全称为Java Open Flash Chart 2，是一个基于Flash的图表生成库，可以方便地在Java应用程序中生成各种动态、交互式的图表。它的主要优点在于提供丰富的图表类型，如折线图、柱状图、饼图等，并支持自定义颜色...

    JOFC2的lineChart提示信息的设置

    NULL 博文链接：https://richard-2010.iteye.com/blog/1153758

    java代码导入导出Excel

    3. **jofc2-1.0-0.jar**： 这个库可能与生成PDF或其他报表相关，但在这个特定场景中，主要的焦点是Excel操作，所以这个库的具体作用可能不是特别关键。 4. **示例代码**： 压缩包中的`ExcelWriter.java`和`...

    Jofc 第一个例子

    2. **Jofc的基本结构**：示例可能会介绍Jofc的基本代码结构，比如如何导入库，定义类和函数，以及如何启动程序。 3. **命令行参数**：如果"demo"是一个可执行文件，它可能接受命令行参数来改变其行为。学习如何传递...

Magicbox
Global site tag (gtag.js) - Google Analytics