OK,
I have the slider demo working in flex2. I do still have one problem with that. The image only loads part of the image and sizes wierd inside of the Canvas. I can't really zoom, if I do, it just moves the image and makes it bigger inside of the canvas, the part I started with. I can never seem to get to other areas of the map with a zoom. The code looks like: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; layout="horizontal" initialize="setupVars()"> <mx:Script> <![CDATA[ var mouse:Point; var rect:Rectangle; var r_img:Rectangle; var r_mask:Rectangle; var xPos:int; var yPos:int; private function setupVars(): void { rect = new Rectangle(0, 0, 450, 350); mouse = new Point(0,0); myMap.load("SB memorial map.png"); myMap.scrollRect = rect; myMap.x = 20; myMap.y = 20; myMap.cacheAsBitmap = true; addEventListener("mouseMove", handleMouseMove); r_img = new Rectangle(0, 0, myMap.width, myMap.height); r_mask = new Rectangle(myMap.x, myMap.y, rect.width, rect.height); } private function handleMouseMove(event:Event):void { if (!chkLockScroll.selected) { mouse.x = myMap.mouseX; mouse.y = myMap.mouseY; if (r_mask.containsPoint(mouse)) { yPos= ( (Math.abs(myMap.y - mouse.y)/rect.height)*(r_img.height - rect.height)); xPos= ( (Math.abs(myMap.x - mouse.x)/rect.width)*(r_img.width - rect.width)); } rect.x += (xPos - rect.x)/8; rect.y += (yPos - rect.y)/8; trace(rect); myMap.scrollRect = rect; } } private function panUp():void { rect.y -= 20; myMap.scrollRect = rect; trace(myMap.scrollRect); } private function panDown():void { rect.y += 20; myMap.scrollRect = rect; trace(myMap.scrollRect); } private function panRight():void { rect.x += 20; myMap.scrollRect = rect; trace(myMap.scrollRect); } private function panLeft():void { rect.x -= 20; myMap.scrollRect = rect; trace(myMap.scrollRect); } private function zoomIn():void { myMap.scaleX += 0.1; myMap.scaleY += 0.1; } private function zoomOut():void { myMap.scaleX -= 0.1; myMap.scaleY -= 0.1; } ]]> </mx:Script> <mx:VBox height="100%"> <mx:Button label="Left" id="btnLeft" click="panLeft()"/> <mx:Button label="Right" id="btnRight" click="panRight()"/> <mx:Button label="Up" id="btnUp" click="panUp()"/> <mx:Button label="Down" id="btnDown" click="panDown()"/> <mx:Spacer/> <mx:Button label="Zoom In" id="btnZoomIn" click="zoomIn()"/> <mx:Button label="Zoom Out" id="btnZoomOut" click="zoomOut()"/> <mx:CheckBox label="Scroll" id="chkLockScroll" selected="true"/> </mx:VBox> <mx:Panel width="100%" height="100%" layout="absolute" cornerRadius="33" backgroundColor="#c0c0c0" id="myPanel" title="Map Basics 101" fontFamily="Georgia" fontSize="16"> <mx:Canvas width="100%" height="100%"> <mx:Image width="100%" height="100%" id="myMap" scaleContent="false"/> </mx:Canvas> </mx:Panel> </mx:Application> Any Ideas? Rich --- In [email protected], "richmcgillicuddy" <[EMAIL PROTECTED]> wrote: > > Hello, > > > I am new to the group and to Flex/Flash. We have a mapping tool that > we had created about a year back that uses flash 8. We want to move up > to Flex 2 for a number of reasons. I am trying to create the mapping > hello world application. We use a standard png image as the background > for the map. I am trying to create a simple image in a panel that has > a series of buttons to the left where I can zoom in/out and pan in all > directions. The zoom in/out is working fine (although I have questions > regarding that) but the pan is not working. My code is attached to the > bottom of this email message. Logically the steps I need to go through > to get this to work are: > > 1. Simple map - Image management Pan Zoom.... Possibly overview window > similar to Google or Yahoo. > 2. Create an object that is a member of that map. This object needs to > be able to display itself as a number of different types (Images, > dots, characters). After reading through tutorials, I can create my > own object that descends from a sprite. My questions here are will the > dot zoom and coordinate based on the zoom, pan of the background map? > How can I make that happen? > 3. More complex tooltips than the standard tooltips. I want a tooltip > that displays about 5-10 lines of information and possibly links to > other areas of the web site. Would you just create a separate window > to act as a tooltip window and place whatever information in the > window you need? > 4. Incorporating effects to the movements of these objects. I've seen > the component explorer, I want the movement of these items on the map > to slide from one spot to the other. The demo app in the explorer > works well. How would you combine multiple effects to happen at the > same time? > > Any help would be greatly appreciated. > > > Step 1 Source Code > > > <?xml version="1.0" encoding="utf-8"?> > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; > layout="horizontal"> > <mx:Script> > <![CDATA[ > > private function panUp():void { > myMap.scrollRect.top -= 10; > trace(myMap.scrollRect); > if (myMap.scrollRect.top < 0) { > myMap.scrollRect.top = 0; > } > } > > private function panDown():void { > myMap.scrollRect.top += 10; > trace(myMap.scrollRect); > if (myMap.scrollRect.top < 0) { > myMap.scrollRect.top = 0; > } > } > > private function panRight():void { > myMap.scrollRect.left += 10; > trace(myMap.scrollRect); > if (myMap.scrollRect.left < 0) { > myMap.scrollRect.left = 0; > } > } > > private function panLeft():void { > myMap.scrollRect.left -= 10; > trace(myMap.scrollRect); > if (myMap.scrollRect.left < 0) { > myMap.scrollRect.left = 0; > } > } > > private function zoomIn():void { > myMap.scaleX += 0.1; > myMap.scaleY += 0.1; > } > > private function zoomOut():void { > myMap.scaleX -= 0.1; > myMap.scaleY -= 0.1; > } > ]]> > </mx:Script> > <mx:VBox height="100%"> > <mx:Button label="Left" id="btnLeft" click="panLeft()"/> > <mx:Button label="Right" id="btnRight" click="panRight()"/> > <mx:Button label="Up" id="btnUp" click="panUp()"/> > <mx:Button label="Down" id="btnDown" click="panDown()"/> > <mx:Spacer/> > <mx:Button label="Zoom In" id="btnZoomIn" click="zoomIn()"/> > <mx:Button label="Zoom Out" id="btnZoomOut" click="zoomOut()"/> > </mx:VBox> > <mx:Panel width="100%" height="100%" layout="absolute" > cornerRadius="33" backgroundColor="#c0c0c0" id="myPanel" title="Map > Basics 101" fontFamily="Georgia" fontSize="16"> > <mx:Image horizontalCenter="20" verticalCenter="20" width="504" > height="601" source="SB memorial map.png" scaleContent="false" > id="myMap"/> > </mx:Panel> > > </mx:Application> > -- Flexcoders Mailing List FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/flexcoders/ <*> To unsubscribe from this group, send an email to: [EMAIL PROTECTED] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
