更多方案  |  文档  |  博客  |  支持库  |  论坛  |  关于   |  EN
如何实现缩放后只改变相对位置而不改变网元尺寸?
作者:jeff  |  日期: 2015-05-04  |  人气: 2,973  |  分类: TWaver Flex

<?xml version="1.0" encoding="utf-8"?>
<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"
			   xmlns:tw="http://www.servasoftware.com/2009/twaver/flex"
			   xmlns:demo="demo.common.*"
			   width="100%" height="100%" minWidth="955" minHeight="600"
			   applicationComplete="init();">
	<fx:Script>
		<![CDATA[
			import flashx.textLayout.formats.Float;
			
			import twaver.*;
			
			private var box:ElementBox = new ElementBox();
			
			private function init():void {	
				network.elementBox = box;	
				
				for(var i:Number=0;i<100;i++){
				var node1:Node = new Node();
				node1.name = "node1";
				node1.setLocation(150+10*i, 200+10*i);
				
				box.add(node1);
				
				var node2:Node = new Node();
				node2.name = "node2";
				node2.setLocation(550+10*i, 200+10*i);
				box.add(node2);
				
				var link:Link = new Link(node1,node2);
				box.add(link);
				}
				
				box.datas.forEach(function(element){
					if(element instanceof Node){
						var node:Node = Node(element);
							node.setClient("location",node.location);
						}
				});
				
				network.addEventListener(MouseEvent.MOUSE_WHEEL, function (e:MouseEvent):void {
					e.preventDefault();
					if(e.delta > 0){
						trace(e.delta);
						//network.zoomIn();
//						zoomIn();
					}else{
						//network.zoomOut();
//						zoomOut();
					}
				});
			}
			
			 function mzoomIn():void{
				var zoom:Number = network.zoom;
				box.datas.forEach(function(element){
					if(element instanceof Node){
						var node:Node = Node(element);
						var x:Number = node.location.x;
						var y:Number = node.location.y;
						zoom = zoom*1.1;
						x = x*1.1;
						y = y*1.1;
						
						node.setLocation(x,y);
					}
				})
			}
			
			private function mzoomOut():void{
				var zoom:Number = network.zoom;
				box.datas.forEach(function(element){
					if(element instanceof Node){
						var node:Node = Node(element);
						var x:Number = node.location.x;
						var y:Number = node.location.y;
						zoom = zoom/1.1;
						x = x/1.1;
						y = y/1.1;
						
						node.setLocation(x,y);
					}
				})
			}
				
			private function mzoomReset():void{
				box.datas.forEach(function(element){
					if(element instanceof Node){
						var node:Node = Node(element);
						var x:Number = node.getClient('location').x;
						var y:Number = node.getClient('location').y;
						node.setLocation(x,y);
					}
				})
			}
		]]>
	</fx:Script>
	
	<mx:HDividedBox width="100%" height="100%">
		<mx:VDividedBox width="70%" height="100%">
			<mx:VBox width="100%" height="70%">
				<mx:HBox width="100%">
					<mx:Button label="Zoom In" height="20" click="mzoomIn()"/>
					<mx:Button label="Zoom Out" height="20" click="mzoomOut()"/>
					<mx:Button label="Zoom Reset" height="20" click="mzoomReset()"/>
				</mx:HBox>
				<tw:NetworkX id="network" width="100%" height="100%" >
				</tw:NetworkX>
			</mx:VBox>
			
		</mx:VDividedBox>
		</mx:HDividedBox>
	
</s:Application>

——TWaver开发组

返回支持库