flex 实现横向树状图

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()" backgroundColor="#FFFFFF"> <mx:Canvas id="paper" x="30" y="24" width="1200" height="1800"> <mx:Canvas id="LEV" name="LEV" x="20" y="17" width="120" height="120" borderStyle="inset"> <mx:Button x="0" y="74" label="关键词导出" width="116" height="20" color="#1B803A"/> <mx:Text x="0" y="20" width="116" height="55" text="List PV:10000" fontSize="12" color="#C71B2B"/> <mx:Image id="LEV_pic" name="LEV_pic" x="94" y="44" width="22" height="22" click="expandRootTree(event)"> <mx:source>{IMAGE_OPEN_SOURCE}</mx:source> </mx:Image> <mx:Button x="0" y="94" label="Button" width="116" height="20" color="#128D1E"/> <mx:Label x="0" y="0" text="Label" width="116" fontSize="14" fontWeight="bold" color="#362DF7"/> </mx:Canvas> </mx:Canvas> <mx:Script> <!--[CDATA[ import mx.controls.Label; import mx.controls.Text; import mx.controls.Button; import mx.containers.Canvas; import mx.collections.ArrayCollection; //面板的长宽 private var CANVAS_WIDTH:Number=120; private var CANVAS_HEIGHT:Number=120; //每个button的长宽 private var BUTTON_WIDTH:Number=116; private var BUTTON_HEIGHT:Number=20; //每个文本框的长宽 private var TEXT_WIDTH:Number=116; private var TEXT_HEIGHT:Number=75; //图片的长宽 private var IMAGE_WIDTH:Number=22; private var IMAGE_HEIGHT:Number=22; //Label的长宽 private var LABEL_WIDTH:Number=116; private var LABEL_HEIGHT:Number=18; //树状图开始位置 private var STARTPOINT_X:Number=280; private var STARTPOINT_Y:Number=20; //父节点与子节点的间隔 private var POINT_WIDTH:Number=200; //节点与相邻兄弟节点的间隔 private var POINT_HEIGHT:Number=130; [Bindable] private var IMAGE_OPEN_SOURCE:String="Tplus.png"; //节点展开的图片 [Bindable] private var IMAGE_CLOSE_SOURCE:String="Lminus.png"; //节点关闭的图片 private function initApp():void { paper.graphics.clear(); test(); } public function createTreeMap(dataArr:Array, treeLength:int):void { var fieldName:String="LEV"; var treeArr:Array=new Array(); //二维数组，保存每个节点的id， id格式为LEV_1_2_3 var node_x:Array=new Array(); var node_y:Array=new Array(); for (var k:int=0; k < dataArr.length; k++) { treeArr[k]=new Array(); node_x[k]=new Array(); node_y[k]=new Array(); // for(var s:int = 0; s < treeLength; s++){ // treeArr[k][s] = "0"; // node_x[k][s] = 0; // node_y[k][s] = 0; // } } var nodeName:String="LEV"; for (var j:int=0; j < treeLength; j++) // { var field:String="field" + (j + 1); var index:int=1; for (var i:int=0; i < dataArr.length; i++) { if (j == 0) { if (i == 0) { treeArr[0][0]=nodeName + "_" + index; createACanvas(treeArr[0][0], STARTPOINT_X, STARTPOINT_Y, dataArr[i][field]); node_x[i][j]=STARTPOINT_X; node_y[i][j]=STARTPOINT_Y; } else { if (dataArr[i][field] == dataArr[i - 1][field] && treeArr[i][j - 1] == treeArr[i-1][j-1]) { treeArr[i][0]=treeArr[i - 1][0]; node_x[i][j]=node_x[i - 1][j]; node_y[i][j]=node_y[i - 1][j]; } else { index++; treeArr[i][0]=nodeName + "_" + index; createACanvas(treeArr[i][0], STARTPOINT_X, STARTPOINT_Y + POINT_HEIGHT * (index - 1), dataArr[i][field]); node_x[i][j]=node_x[i - 1][j]; node_y[i][j]=node_y[i - 1][j] + POINT_HEIGHT; } } } else { if (i == 0) { treeArr[0][j]=treeArr[0][j - 1] + "_" + index; node_x[i][j]=STARTPOINT_X + j * POINT_WIDTH; node_y[i][j]=STARTPOINT_Y; createACanvas(treeArr[i][j], node_x[i][j], node_y[i][j], dataArr[i][field]); } else { if (dataArr[i][field] == dataArr[i - 1][field] && treeArr[i][j - 1] == treeArr[i-1][j-1] ) { treeArr[i][j]=treeArr[i - 1][j]; node_x[i][j]=node_x[i - 1][j]; node_y[i][j]=node_y[i - 1][j]; } else { index++; if(treeArr[i][j - 1] != treeArr[i-1][j-1]){ index = 1; } treeArr[i][j]=treeArr[i][j - 1] + "_" + index; node_x[i][j]=node_x[i - 1][j]; node_y[i][j]=node_y[i][j - 1] + POINT_HEIGHT * (index - 1); createACanvas(treeArr[i][j], node_x[i][j], node_y[i][j], dataArr[i][field]); } } } } } for (var a:int=0; a < dataArr.length ; a++) // { for (var b:int=0; b < treeLength; b++) { trace(treeArr[a][b] + " " + node_x[a][b] + " " + node_y[a][b] + "/n"); } } } public function test():void { var stockDataAC:Array=new Array( {field1: "BD-265|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BD-265|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BD-265|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BD-265|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BD-265|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "gongyingList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "供应List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "供应List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "供应List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "供应List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "服装List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "服装List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "服装List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "SEOList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "小商品List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "BDList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}, {field1: "小商品List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field2: "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%", field3: "SEOList|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"}); var len:int = 3; createTreeMap(stockDataAC, len); } /* public function test():void { createACanvas("LEV_1", 286, 17, "BD-265|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2", 286, 19 + 130, "BDList|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3", 286, 19 + 130 * 2, "供应List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_4", 286, 19 + 130 * 3, "服装List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_5", 286, 19 + 130 * 4, "小商品List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_6", 286, 19 + 130 * 5, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_7", 286, 19 + 130 * 6, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_8", 286, 19 + 130 * 7, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_9", 286, 19 + 130 * 8, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_10", 286, 19 + 130 * 9, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_11", 286, 19 + 130 * 10, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_12", 286, 19 + 130 * 11, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1", 486, 17, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_2", 486, 19 + 130, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_3", 486, 19 + 130 * 2, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_4", 486, 19 + 130 * 3, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_5", 486, 19 + 130 * 4, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_6", 486, 19 + 130 * 5, "List|LPV:100|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2_1", 486, 17, "List|LPV:200|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2_2", 486, 19 + 130, "List|LPV:200|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2_3", 486, 19 + 130 * 2, "List|LPV:200|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2_4", 486, 19 + 130 * 3, "List|LPV:200|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2_5", 486, 19 + 130 * 4, "List|LPV:200|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_2_6", 486, 19 + 130 * 5, "List|LPV:200|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3_1", 486, 17, "List|LPV:300|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3_2", 486, 19 + 130, "List|LPV:300|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3_3", 486, 19 + 130 * 2, "List|LPV:300|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3_4", 486, 19 + 130 * 3, "List|LPV:300|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3_5", 486, 19 + 130 * 4, "List|LPV:300|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_3_6", 486, 19 + 130 * 5, "List|LPV:300|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1_1", 686, 17, "List|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1_2", 686, 19 + 130, "List|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1_3", 686, 19 + 130 * 2, "List|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1_4", 686, 19 + 130 * 3, "List|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1_5", 686, 19 + 130 * 4, "List|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); createACanvas("LEV_1_1_6", 686, 19 + 130 * 5, "List|LPV:400|LPVRate:10.2%|Cookie:3432|CookieRate:3.34%"); } */ //展开关闭节点 public function expandRootTree(e:MouseEvent):void { var t:Object=e.currentTarget; var name:String=e.currentTarget.name; //var target:DisplayObject = paper.getChildByName(name.substr(0,3)); trace(name); //paper.graphics.clear(); if (name.substr(0, 3) == "LEV") { var prefix:String=name.substr(0, name.lastIndexOf("_") == -1 ? name.length : name.lastIndexOf("_")); var target:DisplayObject=paper.getChildByName(prefix); for (var j:int=1; j <= paper.getChildren().length; j++) { var brother:String=name.substr(0, name.substr(0, name.lastIndexOf("_")).lastIndexOf("_") == -1 ? 0 : name.substr(0, name.lastIndexOf("_")).lastIndexOf("_")) + "_" + j; if (brother != prefix) { var varCanvas:DisplayObject=paper.getChildByName(brother); if (varCanvas != null) { var tImage:Image=Image(Canvas(varCanvas).getChildByName(brother + "_pic")); if (tImage != null) { tImage.source=IMAGE_OPEN_SOURCE; } expandTreeNode(varCanvas); } } } for (var i:int=1; i <= paper.getChildren().length; i++) { var child:String=prefix + "_" + i; var canvas:DisplayObject=paper.getChildByName(child); if (canvas != null) { var varImage:Image=Image(Canvas(target).getChildByName(name)); canvas.visible=canvas.visible == true ? false : true; if (canvas.visible == true) { varImage.source=IMAGE_CLOSE_SOURCE; doDraw(target, canvas, 0x333300); } else { varImage.source=IMAGE_OPEN_SOURCE; doDraw(target, canvas, 0xFFFFFF); } if (canvas.visible == false) { expandTreeNode(canvas); } } } } } //递归关闭子节点 public function expandTreeNode(canvas:DisplayObject):void { if (canvas != null) { var parent:String=canvas.name; for (var i:int=1; i <= paper.getChildren().length; i++) { var child:String=parent + "_" + i; var childCanvas:DisplayObject=paper.getChildByName(child); if (childCanvas != null) { var varImage:Image=Image(Canvas(canvas).getChildByName(parent + "_pic")); varImage.source=IMAGE_OPEN_SOURCE; childCanvas.visible=false; if (childCanvas.visible == true) { doDraw(canvas, childCanvas, 0x333300); } else { doDraw(canvas, childCanvas, 0xFFFFFF); } expandTreeNode(childCanvas); } } } } //创建一个节点， private function createACanvas(id:String, x:Number, y:Number, content:String):void { var arr:Array=content.split('|', 5); var canvas:Canvas=new Canvas(); canvas.id=id; canvas.name=id; canvas.x=x; canvas.y=y; //canvas.setActualSize(CANVAS_WIDTH, CANVAS_HEIGHT); canvas.width=CANVAS_WIDTH; canvas.height=CANVAS_HEIGHT; canvas.setStyle("borderStyle", "inset"); var button1:Button=new Button(); button1.id=id + "_button_category"; button1.name=id + "_button_category"; button1.x=0; button1.y=94; button1.addEventListener(MouseEvent.CLICK, exportCategory); // button1.setActualSize(BUTTON_WIDTH,BUTTON_HEIGHT); button1.width=BUTTON_WIDTH; button1.height=BUTTON_HEIGHT; button1.setStyle("color", "#1B803A"); var button:Button=new Button(); button.id=id + "_button_keyword"; button.name=id + "_button_keyword"; button.x=0; button.y=74; button1.addEventListener(MouseEvent.CLICK, exportQuery); // button.setActualSize(BUTTON_WIDTH,BUTTON_HEIGHT); button.width=BUTTON_WIDTH; button.height=BUTTON_HEIGHT; button.setStyle("color", "#1B803A"); var text:Text=new Text(); text.name=id + "_text"; text.id=id + "_text"; text.x=0; text.y=18; // text.setActualSize(TEXT_WIDTH,TEXT_HEIGHT); text.width=TEXT_WIDTH; text.height=TEXT_HEIGHT; text.setStyle("fontSize", "10"); text.setStyle("color", "#C71B2B"); var title:Label=new Label(); title.name=id + "_text"; title.id=id + "_text"; title.x=0; title.y=0; title.width=LABEL_WIDTH; title.height=LABEL_HEIGHT; title.setStyle("fontSize", "14"); title.setStyle("fontWeight", "bold"); title.setStyle("color", "#362DF7"); button1.label="类目list下载"; button.label="Query list下载"; title.text=arr[0]; text.text=arr[1] + "/n" + arr[2] + "/n" + arr[3] + "/n" + arr[4]; var image:Image=new Image(); image.id=id + "_pic"; image.name=id + "_pic"; image.x=92; image.y=18; image.width=IMAGE_WIDTH; image.height=IMAGE_HEIGHT; image.source=IMAGE_OPEN_SOURCE; image.name=id + "_pic"; image.addEventListener(MouseEvent.CLICK, expandRootTree); canvas.addChild(button); canvas.addChild(button1); canvas.addChild(title); canvas.addChild(text); canvas.addChild(image); canvas.visible=false; paper.addChild(canvas); } private function exportQuery(event:Event):void { var button:Button=Button(event.currentTarget); var len:int=String("_button_keyword").length; var textName:String=button.name.substr(0, button.name.length - len) + "text"; var text:Text=Text(button.parent.getChildByName(textName)); //ExternalInterface.call("exportQueryXLS", text.text); } private function exportCategory(event:Event):void { var button:Button=Button(event.currentTarget); var len:int=String("_button_category").length; var textName:String=button.name.substr(0, button.name.length - len) + "text"; var text:Text=Text(button.parent.getChildByName(textName)); //ExternalInterface.call("exportCategoryXLS", text.text); } private function hiddenTarget(source:Sprite, target:Sprite):void { source.visible=false; target.visible=false; } //两个节点之间画直线 private function doDraw(source:DisplayObject, target:DisplayObject, color:int):void { // source.visible = true; // target.visible = true; var radius:Number=10; var sourceCenter:Point=new Point(source.x + source.width, source.y + source.height / 2); var targetCenter:Point=new Point(target.x, target.y + target.height / 2); var sin:Number=(sourceCenter.y - targetCenter.y) / (Math.sqrt(Math.pow(sourceCenter.x - targetCenter.x, 2) + Math.pow(sourceCenter.y - targetCenter.y, 2))); var radian:Number=Math.asin(sin); var degree:Number=radian * 180 / Math.PI; if (source.x < target.x) { if (degree == 0) { degree=180; } if (degree > 0) { degree=180 - degree; } if (degree < 0) { degree=180 + degree * -1; } } degree+=90; radian=degree * Math.PI / 180; var offsetX:Number=0; var offsetY:Number=0; var sourcePointA:Point=new Point(sourceCenter.x + offsetX, sourceCenter.y + offsetY); var sourcePointB:Point=new Point(sourceCenter.x - offsetX, sourceCenter.y - offsetY); var targetPointA:Point=new Point(targetCenter.x + offsetX, targetCenter.y + offsetY); var targetPointB:Point=new Point(targetCenter.x - offsetX, targetCenter.y - offsetY); paper.graphics.lineStyle(1, color, 100); //paper.graphics.lineStyle(1,0x333300,100); var midx:Number=(source.x + source.width + target.x) / 2; var midy:Number=(source.y + target.y) / 2; paper.graphics.moveTo(sourcePointA.x, sourcePointA.y); paper.graphics.lineTo(midx, sourcePointA.y); paper.graphics.moveTo(midx, sourcePointA.y); paper.graphics.lineTo(midx, targetPointA.y); paper.graphics.moveTo(midx, targetPointA.y); paper.graphics.lineTo(targetPointA.x, targetPointA.y); paper.graphics.moveTo(targetPointA.x - 5, targetPointA.y - 5); paper.graphics.lineTo(targetPointA.x, targetPointA.y); paper.graphics.moveTo(targetPointA.x - 5, targetPointA.y + 5); paper.graphics.lineTo(targetPointA.x, targetPointA.y); } ]]--> </mx:Script> </mx:Application>