ArcGis 地图局部切换【原创】

<?xml version="1.0" encoding="utf-8"?>
<BaseWidget xmlns="com.esri.solutions.flexviewer.*"
            xmlns:mx="http://www.adobe.com/2006/mxml"
            x="600"
            y="300"
            creationComplete="init()">


    <mx:Script>
        <![CDATA[
            import com.esri.ags.events.PanEvent;
            import com.esri.ags.layers.Layer;
            import com.esri.solutions.flexviewer.EventArgExtend;
            import com.esri.solutions.flexviewer.MapManager;
            import com.esri.solutions.flexviewer.utils.WidgetEffects;
            
            import mx.core.Application;
            import mx.core.UIComponent;
            import mx.rpc.events.*;

            private var mapManger:MapManager;

            [Bindable]
            private var size:uint=75;

            [Embed("com/esri/solutions/flexviewer/assets/images/icons/Magnifier2.png")]
            private var cursorClass:Class;

            private var g:Graphics;

            private var streetLayer:Layer;

            private var masks:UIComponent;

            private function init():void
            {
                if (configXML)
                {
                    wTemplate.addTitlebarButton(configXML.magnifier.@icon, configXML.magnifier.@label, EventArgExtend.create(SwitchViewState, 0, configXML.magnifier.@label));
                }
                //显示所有图层，注意图层顺序，街道图层在卫星图层上方
                mapShow();
                //index 全局对象
                var app:index=Application.application as index;
                //地图管理对象
                mapManger=app.container.mapManager;
                //街道地图
                streetLayer=map.getLayer("StreetMap");
                //马克赛蒙版图层
                masks=mapManger.getChildByName("masks") as UIComponent;

                streetLayer.visible=false;

            }


            public function SwitchViewState(event:MouseEvent=null, value:int=0, titleValue:String=null, duration:Number=400):void
            {
                wTemplate.setTitle(titleValue);
                WidgetEffects.flipWidget(this, viewStack, "selectedIndex", value, duration);
            }



            /**********************
             * 显示卫星图和街道图
             * *******************/
            private function mapShow():void
            {

                var configBasemaps:Array=configData.configBasemaps;
                for (var i:Number=0; i < configBasemaps.length; i++)
                {
                    var id:String=configBasemaps[i].id;
                    var lyr:Layer=map.getLayer(id);

                    lyr.visible=true;
                    configBasemaps[i].visible=true;
                }
            }


            /**
             * 窗体关闭
             */
            public function widgetClosedHandler():void
            {
                clear();
            }


            /**
             *添加放大镜事件
             **/
            private function onClick_magnifier():void
            {
                streetLayer.mask=masks;
                g=masks.graphics;

                map.addEventListener(MouseEvent.MOUSE_DOWN, mapMouseDown);
                map.addEventListener(MouseEvent.MOUSE_UP, mapMouseUp);
                map.addEventListener(MouseEvent.MOUSE_OVER, onMapMouseOver);
                map.addEventListener(MouseEvent.MOUSE_OUT, onMapMouseOut);

                //禁止漫游
                map.panEnabled=false;
            }

            /**放大镜半径更改*/
            private function optionsChanged():void
            {
                size=size_control.value;
            }

            /**画圆**/
            private function drawCircle():void
            {
                g.beginFill(0);
                g.lineStyle(0, 0);
                g.drawCircle(stage.mouseX, stage.mouseY, size);
                g.endFill();
            }

            /**隐藏鼠标并画圆**/
            private function hideCursorDraw():void
            {
                cursorManager.hideCursor();
                g.clear();
                drawCircle();
            }

            /**鼠标右键按下*/
            private function mapMouseDown(event:MouseEvent):void
            {
                if (map.panEnabled)
                {
                    map.addEventListener(PanEvent.PAN_UPDATE, panUpdae);
                }
                else
                {
                    map.addEventListener(MouseEvent.MOUSE_MOVE, onMapMove);
                }

                if (!streetLayer.visible)
                    streetLayer.visible=true;

                hideCursorDraw();
            }


            /**鼠标右键弹起清空画布*/
            private function mapMouseUp(event:MouseEvent):void
            {
                map.removeEventListener(PanEvent.PAN_UPDATE, panUpdae);
                map.removeEventListener(MouseEvent.MOUSE_MOVE, onMapMove);

                cursorManager.showCursor();
                g.clear();
            }

            /**鼠标经过地图时设置样式*/
            private function onMapMouseOver(event:MouseEvent):void
            {
                cursorManager.removeAllCursors();
                cursorManager.setCursor(cursorClass, 2, 0, 0);
            }

            /**鼠标离开地图时清除样式*/
            private function onMapMouseOut(event:MouseEvent):void
            {
                cursorManager.removeAllCursors();
            }

            /**鼠标在地图上移动实时画圆*/
            private function onMapMove(event:MouseEvent):void
            {
                hideCursorDraw();
            }

            /**地图漫游实时画圆*/
            private function panUpdae(event:PanEvent):void
            {
                hideCursorDraw();
            }


            /**清空*/
            private function clear():void
            {
                map.panEnabled=true;
                streetLayer.visible=false;
                streetLayer.mask=null;
                g=null;

                if (map.hasEventListener(MouseEvent.MOUSE_MOVE))
                    map.removeEventListener(MouseEvent.MOUSE_MOVE, onMapMove);
                if (map.hasEventListener(PanEvent.PAN_UPDATE))
                    map.removeEventListener(PanEvent.PAN_UPDATE, panUpdae);
                if (map.hasEventListener(MouseEvent.MOUSE_DOWN))
                    map.removeEventListener(MouseEvent.MOUSE_DOWN, mapMouseDown);
                if (map.hasEventListener(MouseEvent.MOUSE_UP))
                    map.removeEventListener(MouseEvent.MOUSE_UP, mapMouseUp);
                if (map.hasEventListener(MouseEvent.MOUSE_OVER))
                    map.removeEventListener(MouseEvent.MOUSE_OVER, onMapMouseOver);
                if (map.hasEventListener(MouseEvent.MOUSE_OUT))
                    map.removeEventListener(MouseEvent.MOUSE_OUT, onMapMouseOut);
            }
        ]]>
    </mx:Script>

    <WidgetTemplate id="wTemplate"
                    fontFamily="微软雅黑"
                    fontSize="12"
                    color="#ffffff"
                    widgetClosed="widgetClosedHandler()">
        <mx:ViewStack id="viewStack"
                      width="100%"
                      height="100%"
                      creationPolicy="all"
                      x="10"
                      y="10">
            <mx:Canvas width="100%"
                       height="100%">
                <mx:Label x="47"
                          y="2"
                          text="放大镜半径:{size}"/>
                <mx:HSlider value="{size}"
                            thumbCount="1"
                            id="size_control"
                            minimum="25"
                            maximum="200"
                            snapInterval="1"
                            dataTipPrecision="0"
                            tickValues="{[25,50,75,100,125,150,175,200]}"
                            change="optionsChanged()"
                            x="141"
                            y="5"/>
                <mx:Image source="com/esri/solutions/flexviewer/assets/images/icons/spotlight.png"
                          click="onClick_magnifier()"
                          x="122"
                          y="43"
                          toolTip="放大镜"/>

                <mx:Image source="com/esri/solutions/flexviewer/assets/images/icons/i_clear.png"
                          x="176"
                          y="43"
                          toolTip="清除"
                          click="clear()"/>
                <mx:HRule x="5"
                          y="91"
                          width="100%"
                          left="5"
                          right="5"
                          strokeColor="#1F69ED"
                          strokeWidth="1"/>
            </mx:Canvas>


        </mx:ViewStack>
    </WidgetTemplate>



</BaseWidget>