<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:ravis="org.un.cava.birdeye.ravis.graphLayout.visual.*"
xmlns:lc="org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.*"
xmlns:vc="org.un.cava.birdeye.ravis.components.ui.controls.vgraphControls.*"
xmlns:flexlib="http://code.google.com/p/flexlib/"
width="100%" height="100%"
creationComplete="init();">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.LayoutSelector;
import org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.PhiDial;
import org.un.cava.birdeye.ravis.components.ui.controls.vgraphControls.EdgeRendererSelector;
import org.un.cava.birdeye.ravis.graphLayout.data.Graph;
import org.un.cava.birdeye.ravis.graphLayout.data.IGraph;
import org.un.cava.birdeye.ravis.graphLayout.layout.ConcentricRadialLayouter;
import org.un.cava.birdeye.ravis.graphLayout.layout.IAngularLayouter;
import org.un.cava.birdeye.ravis.graphLayout.layout.ILayoutAlgorithm;
import org.un.cava.birdeye.ravis.graphLayout.layout.ParentCenteredRadialLayouter;
import org.un.cava.birdeye.ravis.graphLayout.visual.IEdgeRenderer;
import org.un.cava.birdeye.ravis.graphLayout.visual.IVisualNode;
import org.un.cava.birdeye.ravis.graphLayout.visual.VisualGraph;
import org.un.cava.birdeye.ravis.graphLayout.visual.edgeRenderers.DirectedBalloonEdgeRenderer;
import renderers.edgelabels.mxml.basicEdgeLabelRenderer;
private var graph:IGraph;
private var layouter:IAngularLayouter;
private var selectedEdgeRenderer:IEdgeRenderer;
private var startRoot:IVisualNode;
private var itemCount:int = 0;
private var initDone:Boolean = false;
private function init():void
{
var strXML:String ="<graph>"
+"<Node id=\"1\" name=\"\" nodeColor=\"0xaf3a99\" nodeSize=\"0\" nodeIcon=\"center\" />"
+"<Node id=\"2\" name=\"B60R\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />"
+"<Node id=\"3\" name=\"H01L\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />"
+"<Node id=\"4\" name=\"B24B\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />"
+"<Node id=\"5\" name=\"H01M\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"6\" name=\"B25J\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"7\" name=\"G05B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"8\" name=\"H04L\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"9\" name=\"H01R\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+ "<Node id=\"10\" name=\"G05G\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"11\" name=\"H05K\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"12\" name=\"H01H\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"13\" name=\"H03H\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"14\" name=\"G06F\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"15\" name=\"H04Q\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"16\" name=\"A63B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"17\" name=\"G06T\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"18\" name=\"E05B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"19\" name=\"G01N\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"20\" name=\"F02B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"21\" name=\"F04C\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"22\" name=\"B23C\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"23\" name=\"H04B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"24\" name=\"B62D\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"25\" name=\"H02K\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Edge fromID=\"1\" toID=\"2\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"2\" toID=\"3\" edgeLabel=\"1228\" color=\"0x556b2f\" />"
+"<Edge fromID=\"4\" toID=\"3\" edgeLabel=\"589\" color=\"0x556b2f\" />"
+"<Edge fromID=\"4\" toID=\"5\" edgeLabel=\"233\" color=\"0x556b2f\" />"
+"<Edge fromID=\"4\" toID=\"6\" edgeLabel=\"216\" color=\"0x556b2f\" />"
+ "<Edge fromID=\"6\" toID=\"7\" edgeLabel=\"294\" color=\"0x556b2f\" />"
+"<Edge fromID=\"6\" toID=\"8\" edgeLabel=\"211\" color=\"0x556b2f\" />"
+"<Edge fromID=\"2\" toID=\"8\" edgeLabel=\"553\" color=\"0x556b2f\" />"
+"<Edge fromID=\"3\" toID=\"9\" edgeLabel=\"244\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"10\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"10\" toID=\"11\" edgeLabel=\"701\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"12\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"12\" toID=\"13\" edgeLabel=\"523\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"14\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"14\" toID=\"15\" edgeLabel=\"522\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"16\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"16\" toID=\"17\" edgeLabel=\"402\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"18\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"18\" toID=\"19\" edgeLabel=\"350\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"20\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"20\" toID=\"21\" edgeLabel=\"304\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"22\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"22\" toID=\"23\" edgeLabel=\"300\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"24\" edgeLabel=\"\" color=\"0xFFFFFF\" />"
+"<Edge fromID=\"24\" toID=\"25\" edgeLabel=\"298\" color=\"0x556b2f\" />"
+"</graph>"
initData(strXML);//
//nodeSize 球的大小, nodeColor 节点的颜色 edgeLabel=线上的描述
ExternalInterface.addCallback("GetXMLFunction",initData); }
private function initData(strXML:String):void {
var xmldata:XML = new XML(strXML);
graph = new org.un.cava.birdeye.ravis.graphLayout.data.Graph("XMLAsDocsGraph",false,xmldata);
vgraph.graph = graph;
layouter = new ParentCenteredRadialLayouter(vgraph);
vgraph.layouter = layouter;
layouter.autoFitEnabled = false;
//layouter.linkLength = 300;
//layouter.phi = 300;
//layouter.layoutChanged = true;
vgraph.edgeRendererFactory = new ClassFactory(DirectedBalloonEdgeRenderer);
vgraph.maxVisibleDistance = 5;
//指定根节点 startRoot = graph.nodeByStringId("1").vnode;
vgraph.displayEdgeLabels = true;
vgraph.currentRootVNode = startRoot;
initDone = true;
//线条样式
var myEdgeRender:EdgeRendererSelector = new EdgeRendererSelector();
myEdgeRender.selectedItem = "Default";
myEdgeRender.vgraph = vgraph;
myEdgeRender.changeEdgeRenderer();
var selector:LayoutSelector = new LayoutSelector();
selector.vgraph = vgraph;
selector.selectedItem = "ConcentricRadial";
selector.changeLayouter();
vgraph.draw();
} ]]>
</mx:Script>
<!-- <mx:Style source="styles/main.css"/> -->
<mx:Canvas id="graphCnvs" width="100%" height="100%">
<ravis:VisualGraph id="vgraph" width="100%" height="100%"
left="0" right="0" top="0" bottom="5"
backgroundColor="#FFFFFF" alpha="1"
itemRenderer="renderers.nodes.mxml.sizeColorNodeRenderer"
edgeLabelRenderer="renderers.edgelabels.mxml.basicEdgeLabelRenderer"
resize="vgraph.draw(VisualGraph.DF_RESET_LL)"
visibilityLimitActive="true"
>
</ravis:VisualGraph>
<flexlib:WindowShade
id="layoutContainer"
styleName="linkButtonWindowShade"
label="setup"
width="400"
opened="false"
horizontalAlign="center"
paddingBottom="5"
visible="false">
<lc:PhiDial id="myPhiDial" vgraph="{vgraph}"/>
<lc:ToggleDamping id="myDamping" vgraph="{vgraph}"/>
<lc:CommonLayoutControls id="myCommonLC" vgraph="{vgraph}"/>
</flexlib:WindowShade>
</mx:Canvas>
</mx:Application>
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:ravis="org.un.cava.birdeye.ravis.graphLayout.visual.*"
xmlns:lc="org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.*"
xmlns:vc="org.un.cava.birdeye.ravis.components.ui.controls.vgraphControls.*"
xmlns:flexlib="http://code.google.com/p/flexlib/"
width="100%" height="100%"
creationComplete="init();">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
import org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.LayoutSelector;
import org.un.cava.birdeye.ravis.components.ui.controls.layouterControls.PhiDial;
import org.un.cava.birdeye.ravis.components.ui.controls.vgraphControls.EdgeRendererSelector;
import org.un.cava.birdeye.ravis.graphLayout.data.Graph;
import org.un.cava.birdeye.ravis.graphLayout.data.IGraph;
import org.un.cava.birdeye.ravis.graphLayout.layout.ConcentricRadialLayouter;
import org.un.cava.birdeye.ravis.graphLayout.layout.IAngularLayouter;
import org.un.cava.birdeye.ravis.graphLayout.layout.ILayoutAlgorithm;
import org.un.cava.birdeye.ravis.graphLayout.layout.ParentCenteredRadialLayouter;
import org.un.cava.birdeye.ravis.graphLayout.visual.IEdgeRenderer;
import org.un.cava.birdeye.ravis.graphLayout.visual.IVisualNode;
import org.un.cava.birdeye.ravis.graphLayout.visual.VisualGraph;
import org.un.cava.birdeye.ravis.graphLayout.visual.edgeRenderers.DirectedBalloonEdgeRenderer;
import renderers.edgelabels.mxml.basicEdgeLabelRenderer;
private var graph:IGraph;
private var layouter:IAngularLayouter;
private var selectedEdgeRenderer:IEdgeRenderer;
private var startRoot:IVisualNode;
private var itemCount:int = 0;
private var initDone:Boolean = false;
[Bindable]
private var CDATA_INFO:String = "";
public static const URL_CONST:String="http://109.119.20.58:8080/webfront/Flex/test.do";
private function init():void
{
var strXML:String="";
/* var strXML:String ="<graph>"
+"<Node id=\"1\" name=\"1\" desc=\"This is a description\" nodeColor=\"0xaf3a99\" nodeSize=\"30\" nodeIcon=\"center\" />"
+"<Node id=\"2\" name=\"2\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />"
+"<Node id=\"3\" name=\"3\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />"
+"<Node id=\"4\" name=\"4\" nodeColor=\"0xaf3a42\" nodeSize=\"50\" />"
+"<Node id=\"5\" name=\"5\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"6\" name=\"6\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"7\" name=\"7\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"8\" name=\"8\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"9\" name=\"9\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"10\" name=\"10\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"11\" name=\"11\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"12\" name=\"12\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"13\" name=\"13\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"14\" name=\"14\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"15\" name=\"H04Q\" nodeColor=\"0xaf3a42\" nodeSize=\"40\" />"
+"<Node id=\"16\" name=\"A63B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"17\" name=\"G06T\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"18\" name=\"E05B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"19\" name=\"G01N\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"20\" name=\"F02B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"21\" name=\"F04C\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"22\" name=\"B23C\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"23\" name=\"H04B\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"24\" name=\"B62D\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Node id=\"25\" name=\"H02K\" nodeColor=\"0xaf3a42\" nodeSize=\"30\" />"
+"<Edge fromID=\"1\" toID=\"2\" edgeLabel=\"1-2\" color=\"0x556b2f\" />"
+"<Edge fromID=\"2\" toID=\"3\" edgeLabel=\"1228\" color=\"0x556b2f\" />"
+"<Edge fromID=\"4\" toID=\"3\" edgeLabel=\"589\" color=\"0x556b2f\" />"
+"<Edge fromID=\"4\" toID=\"5\" edgeLabel=\"233\" color=\"0x556b2f\" />"
+"<Edge fromID=\"4\" toID=\"6\" edgeLabel=\"216\" color=\"0x556b2f\" />"
+ "<Edge fromID=\"6\" toID=\"7\" edgeLabel=\"294\" color=\"0x556b2f\" />"
+"<Edge fromID=\"6\" toID=\"8\" edgeLabel=\"211\" color=\"0x556b2f\" />"
+"<Edge fromID=\"2\" toID=\"8\" edgeLabel=\"553\" color=\"0x556b2f\" />"
+"<Edge fromID=\"3\" toID=\"9\" edgeLabel=\"244\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"10\" edgeLabel=\"1-10\" color=\"0x556b2f\" />"
+"<Edge fromID=\"10\" toID=\"11\" edgeLabel=\"701\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"12\" edgeLabel=\"1-12\" color=\"0x556b2f\" />"
+"<Edge fromID=\"12\" toID=\"13\" edgeLabel=\"523\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"14\" edgeLabel=\"1-14\" color=\"0x556b2f\" />"
+"<Edge fromID=\"14\" toID=\"15\" edgeLabel=\"522\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"16\" edgeLabel=\"1-16\" color=\"0x556b2f\" />"
+"<Edge fromID=\"16\" toID=\"17\" edgeLabel=\"402\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"18\" edgeLabel=\"1-18\" color=\"0x556b2f\" />"
+"<Edge fromID=\"18\" toID=\"19\" edgeLabel=\"350\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"20\" edgeLabel=\"1-20\" color=\"0x556b2f\" />"
+"<Edge fromID=\"20\" toID=\"21\" edgeLabel=\"304\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"22\" edgeLabel=\"1-22\" color=\"0x556b2f\" />"
+"<Edge fromID=\"22\" toID=\"23\" edgeLabel=\"300\" color=\"0x556b2f\" />"
+"<Edge fromID=\"1\" toID=\"24\" edgeLabel=\"1-24\" color=\"0x556b2f\" />"
+"<Edge fromID=\"24\" toID=\"25\" edgeLabel=\"298\" color=\"0x556b2f\" />"
+"</graph>" */
//initData(strXML);//
//nodeSize 球的大小, nodeColor 节点的颜色 edgeLabel=线上的描述
// ExternalInterface.addCallback("GetXMLFunction",initData);
}
private function initData(strXML:String):void {
//laura: try the local test data
//var xmldata:XML = new XML(strXML);
graph = new org.un.cava.birdeye.ravis.graphLayout.data.Graph("XMLAsDocsGraph",false,xmldata);
vgraph.graph = graph;
/* layouter = new ParentCenteredRadialLayouter(vgraph);
vgraph.layouter = layouter;
layouter.autoFitEnabled = true; */
//layouter.linkLength = 300;
//layouter.phi = 300;
//layouter.layoutChanged = true;
vgraph.edgeRendererFactory = new ClassFactory(DirectedBalloonEdgeRenderer);
vgraph.maxVisibleDistance = 6;
//指定根节点
startRoot = graph.nodeByStringId("1").vnode;
vgraph.displayEdgeLabels = true;
vgraph.currentRootVNode = startRoot;
initDone = true;
//线条样式 ,这个样式与之前的edgeRenderFactory定义是重复的~
/* var myEdgeRender:EdgeRendererSelector = new EdgeRendererSelector();
myEdgeRender.selectedItem = "DirectedBalloons";
myEdgeRender.vgraph = vgraph;
myEdgeRender.changeEdgeRenderer(); */
//这个与之前的layouter的定义也重复
var selector:LayoutSelector = new LayoutSelector();
selector.vgraph = vgraph;
selector.selectedItem = "ForceDirected";
selector.changeLayouter();
showNodeDetail(vgraph.currentRootVNode,"");
vgraph.draw();
}
public function search(event:ResultEvent):void{
//pageCombo.dataProvider = new Array();
nodeImg.visible = false;
xmldata= XML(event.result);
//tryRest:String=event.result.toString();
CDATA_INFO += " id:<b> "+event.result.toString()+"</b><br><br>"
//initPageCombo();
initData("123");
}
public function showNodeDetail(node:IVisualNode,type:String):void{
nodeImg.visible = false;
CDATA_INFO="";
if(String(node.data.@id).length>0 ){
CDATA_INFO += " id:<b> "+node.data.@id+"</b><br><br>"
//CDATA_INFO += " id:<b> "+event.result.toString();+"</b><br><br>"
}
if(String(node.data.@name).length>0){
CDATA_INFO += " name:<b> "+node.data.@name+"</b><br><br>"
}
if(String(node.data.@table).length>0){
//Alert.show(node.data.data.@name);
//key.text=node.data.@name;
//tableName.text= node.data.@table;
CDATA_INFO += " table:<b> "+node.data.@table+"</b><br><br>"
}
/* var properties:String = showSuccessorInfo(node);
if(properties.length > 4){
CDATA_INFO +=properties;
} */
}
]]>
</mx:Script>
<mx:Style source="styles/main.css"/>
<mx:XML id="xmldata"/>
<!--<mx:XML id="xmldata" source="data/test.xml"/>-->
<mx:HTTPService id="searchHttp" url="{URL_CONST}" resultFormat="xml" showBusyCursor="true" result="search(event);" >
<!--<mx:request>
<key>{key.text}</key>
<table>{tableName.text}</table>
<limitNum>{limitNumCombo.text}</limitNum>
<currentPage>{pageCombo.text}</currentPage>
</mx:request>-->
</mx:HTTPService>
<mx:Canvas id="graphCnvs" width="100%" height="100%">
<ravis:VisualGraph id="vgraph" width="100%" height="100%"
left="0" right="0" top="0" bottom="5"
backgroundColor="#FFFFFF" alpha="1"
itemRenderer="renderers.nodes.mxml.sizeColorNodeRenderer"
edgeLabelRenderer="renderers.edgelabels.mxml.basicEdgeLabelRenderer"
resize="vgraph.draw(VisualGraph.DF_RESET_LL)"
visibilityLimitActive="true"
>
</ravis:VisualGraph>
<mx:VBox top="0" left="2">
<mx:TextArea id="details" fontSize="14" textAlign="left" width="360" height="280">
<mx:htmlText>{CDATA_INFO}</mx:htmlText>
</mx:TextArea>
</mx:VBox>
<flexlib:WindowShade
id="layoutContainer"
styleName="linkButtonWindowShade"
label="setup"
width="400"
opened="false"
horizontalAlign="center"
paddingBottom="5"
visible="false">
<lc:PhiDial id="myPhiDial" vgraph="{vgraph}"/>
<lc:ToggleDamping id="myDamping" vgraph="{vgraph}"/>
<lc:CommonLayoutControls id="myCommonLC" vgraph="{vgraph}"/>
</flexlib:WindowShade>
<mx:Image id="nodeImg" source="" top="280" left="2" width="360" height="500" name="" visible="false"/>
</mx:Canvas>
</mx:Application>