使用Flex做出对比杜邦分析图
前段时间让做一个对比的杜邦分析图报表，网上看了看，要么就是特专业的报表工具。所以自己用Flex弄了个，然后交互下数据得了。
杜邦分析体系，大家可以google之。
1.javaScript 调用 Flex
html代码:
<table width="100%" id = "dupontList"> <embed src="<%=basePath%>flex/Dupont.swf" width="100%" height="1300" id="dupontFlex"></embed> </table>
js代码: dupontFlex.getFlexDupont('companyIDA','companyIDB','20131011');
js调用 Flex方法 代码如下
加载页面时候调用 init()方法, init方法中的那一段代码为注册一个钩子给js可以调用，js调用的方法名为引号中的方法,
后面没有引号的及是flex中具体的方法名。
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" width="1318" height="1280"
creationComplete="init()">
import flash.external.ExternalInterface; public function init():void{ ExternalInterface.addCallback("getFlexDupont",getFlexDupont);//注册init方法，使js可以调用 }
public function getFlexDupont(companyA:String,companyB:String,data:String):void{
remoDupont.getDupont(companyA,companyB,data); }
Flex 调用 java 代码
首先 bin-debug 目录输出选择 web项目的目录就不做说明了
Flex 调用java
remoting-config.xml 配置信息如下
<destination id="remoDupont"> <properties><source>com.xx.xx.xx.action.CreateChartAction</source></properties> </destination>
action方法信息如下
public Map getDupont(String companyA,String companyB,String data)throws SQLException{ Map map = new HashMap(); System.out.println("=======------->>>"+data); System.out.println(data.split(",").length); map.put("Acompany", companyA); CreateChartService cService = new CreateChartService(); //System.out.println(createChartService); System.out.println(cService); String bac = cService.getDupont(companyA, companyB, data); map.put("Bcompany", bac); map.put("Aval", "5%"); map.put("Bval", "26%"); map.put("Dval", "21%"); return map; }
Flex 调用部分如下
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
<s:RemoteObject id="remoDupont" destination="remoDupont" endpoint="项目名/messagebroker/amf">
<s:method name="getDupont" result="resultDupont(event)"/>
</s:RemoteObject>
</fx:Declarations>
import mx.rpc.events.ResultEvent; [Bindable] private var acompany:String; [Bindable] private var bcompany:String; [Bindable] private var aval:String; [Bindable] private var bval:String; [Bindable] private var dval:String; private function resultDupont(event:ResultEvent):void{ acompany = event.result["Acompany"].toString(); bcompany = event.result["Bcompany"].toString(); aval = event.result["Aval"].toString(); bval = event.result["Bval"].toString(); dval = event.result["Dval"].toString(); }
Flex画图部分如下
<s:BorderContainer id="Total" x="585" y="10" width="148" height="96">
<s:TextArea x="0" y="0" width="148" height="24" text="权益净利率" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="24" width="74" height="24" text="{acompany}" fontSize="10" textAlign="center" />
<s:TextArea x="74" y="24" width="74" height="24" text="{aval}" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="48" width="74" height="24" text="{bcompany}" fontSize="10" textAlign="center"/>
<s:TextArea x="74" y="48" width="74" height="24" text="{bval}" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="72" width="74" height="24" text="差值" fontSize="12" textAlign="center"/>
<s:TextArea x="74" y="72" width="74" height="24" text="{dval}" fontSize="12" textAlign="center"/>
</s:BorderContainer>
<s:BorderContainer id="Total1" x="735" y="381" width="148" height="96">
<s:TextArea x="0" y="0" width="148" height="24" text="总资产周转率" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="24" width="74" height="24" text="{acompany}" fontSize="10" textAlign="center" />
<s:TextArea x="74" y="24" width="74" height="24" text="A公司数据" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="48" width="74" height="24" text="{bcompany}" fontSize="10" textAlign="center"/>
<s:TextArea x="74" y="48" width="74" height="24" text="B公司数据" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="72" width="74" height="24" text="差值" fontSize="12" textAlign="center"/>
<s:TextArea x="74" y="72" width="74" height="24" text="差值" fontSize="12" textAlign="center"/>
</s:BorderContainer>
<s:BorderContainer id="Total2" x="933" y="193" width="148" height="96">
<s:TextArea x="0" y="0" width="148" height="24" text="权益数" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="24" width="74" height="24" text="{acompany}" fontSize="10" textAlign="center" />
<s:TextArea x="74" y="24" width="74" height="24" text="A公司数据" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="48" width="74" height="24" text="{bcompany}" fontSize="10" textAlign="center"/>
<s:TextArea x="74" y="48" width="74" height="24" text="B公司数据" fontSize="12" textAlign="center"/>
<s:TextArea x="0" y="72" width="74" height="24" text="差值" fontSize="12" textAlign="center"/>
<s:TextArea x="74" y="72" width="74" height="24" text="差值" fontSize="12" textAlign="center"/>
</s:BorderContainer>
<!-- 画一个红色的直线 -->
<s:Line width="0" x="660" y="106" height="42">
<s:stroke>
<s:SolidColorStroke color="0xff0000" weight="2"/>
</s:stroke>
</s:Line>
<!-- 画一个颜色渐变的直线 -->
<s:Line width="683" x="326" y="150" height="1">
<s:stroke>
<s:LinearGradientStroke weight="2">
<s:GradientEntry color="#ff0000"/>
<s:GradientEntry color="#ffff00"/>
</s:LinearGradientStroke>
</s:stroke>
</s:Line>
<s:Line width="633" x="177" y="336" height="1">
<s:stroke>
<s:LinearGradientStroke weight="2">
<s:GradientEntry color="#ff0000"/>
<s:GradientEntry color="#ffff00"/>
</s:LinearGradientStroke>
</s:stroke>
</s:Line>
效果图如下
- -~~~突然发现表达能力是渣渣。
