主程序: 1.<?xml version="1.0" encoding="utf-8"?> 2.<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 3. creationComplete="init()" fontSize="12" backgroundColor="#FFFFFF" 4. layout="absolute" minWidth="955" minHeight="600"> 5. <mx:Script> 6. <!--[CDATA[ 7. import com.njit.LinkLine; 8. import com.njit.LinkMap; 9. private var point1:Point; 10. private var point2:Point; 11. private var map1:LinkMap; 12. private var map2:LinkMap; 13. private var line:LinkLine; 14. private var colorArr:Array=["0xFF0000","0x00FF00","0x0000FF","0xFFFF00"]; 15. private var k:int=0; 16. 17. private function init():void{ 18. point1=new Point(50,50); 19. point2=new Point(300,300); 20. map1=new LinkMap(point1,100,80,"主机",1); 21. map2=new LinkMap(point2,100,80,"服务器",2); 22. line=new LinkLine(); 23. line.setStartPoint(new Point(map1.getCenterX(),map1.getCenterY())); 24. line.setEndPoint(new Point(map2.getCenterX(),map2.getCenterY())); 25. line.setTip("哈哈哈哈"); 26. line.drawLine(); 27. map1.setLine(line,true); 28. map2.setLine(line,false); 29. this.addChild(map1); 30. this.addChild(map2); 31. this.addChild(line); 32. 33. var time:Timer = new Timer(1000,100); 34. time.addEventListener(TimerEvent.TIMER,doTime); 35. time.start(); 36. } 37. //定时器设置颜色线条颜色变换 38. private function doTime(event:TimerEvent):void{ 39. line.setLineColor(colorArr[k++]); 40. line.drawLine(); 41. if(k>=colorArr.length) 42. k=0; 43. } 44. ]]--> 45. </mx:Script> 46.</mx:Application> 线条类: 1.package com.njit 2.{ 3. import flash.geom.Point; 4. 5. import mx.core.UIComponent; 6. 7. public class LinkLine extends UIComponent{ 8. 9. //线起点 10. private var startPoint:Point; 11. //线终点 12. private var endPoint:Point; 13. //线条颜色 14. private var lineColor:uint=0x000000; 15. //线提示语 16. private var tip:String=" "; 17. //是否要箭头 18. private var isArrow:Boolean=true; 19. //箭头大小 20. private var radius:uint=6; 21. 22. 23. public function LinkLine(){ 24. super(); 25. } 26. 27. //获得线的角度 28. public function getAngle():Number{ 29. var tmpx:Number=endPoint.x - startPoint.x; 30. var tmpy:Number=startPoint.y - endPoint.y; 31. var angle:Number= Math.atan2(tmpy,tmpx)*(180/Math.PI); 32. return angle; 33. } 34. 35. //画线 36. public function drawLine():void{ 37. this.graphics.clear(); 38. this.graphics.lineStyle(2,lineColor); 39. this.graphics.moveTo(startPoint.x,startPoint.y); 40. this.graphics.lineTo(endPoint.x,endPoint.y); 41. this.toolTip=tip; 42. if(isArrow){ 43. var angle:Number = this.getAngle(); 44. var centerX:Number = endPoint.x - radius * Math.cos(angle*(Math.PI/180)); 45. var centerY:Number = endPoint.y + radius * Math.sin(angle*(Math.PI/180)); 46. var topX:Number = endPoint.x; 47. var topY:Number = endPoint.y; 48. var leftX:Number = centerX + radius * Math.cos((angle+120)*(Math.PI/180)); 49. var leftY:Number = centerY - radius * Math.sin((angle+120)*(Math.PI/180)); 50. var rightX:Number = centerX + radius * Math.cos((angle+240)*(Math.PI/180)); 51. var rightY:Number = centerY - radius * Math.sin((angle+240)*(Math.PI/180)); 52. this.graphics.beginFill(lineColor,1); 53. this.graphics.lineStyle(2,lineColor,1); 54. this.graphics.moveTo(topX,topY); 55. this.graphics.lineTo(leftX,leftY); 56. this.graphics.lineTo(centerX,centerY); 57. this.graphics.lineTo(rightX,rightY); 58. this.graphics.lineTo(topX,topY); 59. this.graphics.endFill(); 60. } 61. } 62. public function removeLine():void{ 63. this.graphics.clear(); 64. } 65. 66. public function setStartPoint(point:Point):void{ 67. this.startPoint=point; 68. } 69. public function setEndPoint(point:Point):void{ 70. this.endPoint=point; 71. } 72. public function setLineColor(color:uint):void{ 73. this.lineColor=color; 74. } 75. public function setTip(tip:String):void{ 76. this.tip=tip; 77. } 78. public function setArrow(flag:Boolean):void{ 79. this.isArrow=flag; 80. } 81. } 82.} 节点类: 1.package com.njit 2.{ 3. import flash.events.MouseEvent; 4. import flash.geom.Point; 5. 6. import mx.containers.Canvas; 7. import mx.controls.Image; 8. import mx.controls.Label; 9. import mx.events.MoveEvent; 10. 11. public class LinkMap extends Canvas{ 12. 13. [Embed(source="assets/images/client.png")] 14. [Bindable] 15. public var c2s:Class; 16. 17. [Embed(source="assets/images/server.png")] 18. [Bindable] 19. public var s2c:Class; 20. //网元名称 21. private var ueName:String = "网元"; 22. private var lineList:Array =new Array(); 23. private var lineCount:int = 0; 24. private var oldIndex:int = 0; 25. private var ueImage:Image=new Image(); 26. private var ueLabel:Label=new Label(); 27. 28. public function LinkMap(point:Point,width:int,height:int,ueName:String,type:int){ 29. super(); 30. this.x=point.x; 31. this.y=point.y; 32. this.width=width; 33. this.height=height; 34. this.ueName=ueName; 35. this.init(type); 36. } 37. //初始化 38. private function init(type:int):void{ 39. this.addEventListener(flash.events.MouseEvent.MOUSE_DOWN,dragBegin); 40. this.addEventListener(flash.events.MouseEvent.MOUSE_UP,dragEnd); 41. this.addEventListener(flash.events.MouseEvent.MOUSE_MOVE,dragIng2); 42. this.addEventListener(mx.events.MoveEvent.MOVE,dragIng1); 43. this.verticalScrollPolicy = "off"; 44. this.horizontalScrollPolicy = "off"; 45. this.initLabel(); 46. this.addChild(ueLabel); 47. this.initUeImage(type); 48. this.addChild(ueImage); 49. } 50. private function initUeImage(flag:int):void{ 51. switch(flag){ 52. case 1: 53. ueImage.source = c2s;break; 54. case 2: 55. ueImage.source = s2c;break; 56. } 57. ueImage.x = 10; 58. ueImage.y = 0; 59. } 60. 61. private function initLabel():void{ 62. ueLabel.text = ueName; 63. ueLabel.x = 0; 64. ueLabel.y = 60; 65. ueLabel.width = 99; 66. ueLabel.height = 20; 67. } 68. 69. private function dragIng1(event:MoveEvent):void{ 70. this.refreshLine(); 71. } 72. private function dragIng2(event:MouseEvent):void{ 73. this.refreshLine(); 74. } 75. private function refreshLine():void{ 76. var x:int = this.getCenterX(); 77. var y:int = this. getCenterY(); 78. for(var i:int=0;i<lineList.length;i++){ 79. var lineFlag:LineFlag = lineList[i]; 80. var line:LinkLine = lineFlag.getLine(); 81. var isHeaderLine:Boolean = lineFlag.getFlag(); 82. if(isHeaderLine){ 83. line.setStartPoint(new Point(x,y)); 84. }else{ 85. line.setEndPoint(new Point(x,y)); 86. } 87. line.drawLine(); 88. } 89. } 90. 91. public function setLine(line:LinkLine,flag:Boolean):void{ 92. var lineFlag:LineFlag = new LineFlag(line,flag); 93. lineList[lineCount] = lineFlag; 94. lineCount++; 95. } 96. 97. 98. private function dragBegin(event:MouseEvent):void{ 99. oldIndex = this.parent.getChildIndex(this); 100. this.parent.setChildIndex(this,this.parent.numChildren-1); 101. this.startDrag(false); 102. } 103. private function dragEnd(event:MouseEvent):void{ 104. this.parent.setChildIndex(this,oldIndex); 105. this.stopDrag(); 106. } 107. public function getCenterX():int{ 108. return this.x+30; 109. } 110. public function getCenterY():int{ 111. return this.y+30; 112. } 113. } 114.}