ArcGIS Flex API 中的 Flex 技术(一)--事件

    作者:Flyingis

    本文严禁用于商业目的,如需转载请注明作者及原文链接,其他疑问请联系:dev.vip#gmail.com

    在ArcGIS Flex API中探索Flex使用是一种不错的学习方法,可以相互辅助理解ArcGIS Flex API和Flex,这两天重新翻阅了一些官方资料,写一点小结,从之前的一篇事件开始。

    ArcGIS Flex API是基于Flex API的一个开发库,开发之前需要导入agslib.swc,根据WebGIS所需的功能可以想到,事件是用户和地图进行交互的基础,没有丰富的事件交互机制就很难为用户提供完整的WebGIS应用体验,如果换成是自己去设计ArcGIS Flex API,我们会从哪些功能需求入手?

    点击图层的地理要素进行查询,鼠标移动到查询图层的地理要素上方,异步弹出该要素基本信息窗口。没错,这些都是WebGIS的基本需求,那么通过一个sample看在ArcGIS Flex API如何使用事件。

ContractedBlock.gifExpandedBlockStart.gifCode
<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    
xmlns:mx="http://www.adobe.com/2006/mxml" 
    pageTitle
="Map Click (but not on pan & zoom)" 
    xmlns:esri
="http://www.esri.com/2008/ags" 
    layout
="absolute"
    
>
    
<mx:Script>
        
<![CDATA[/** * Problem:  You want to capture a "click" on the map, but not a pan or other mouse navigation actions. * 
        Solution: Use mouseDown and panStart instead of the click property. */
        import mx.controls.Button;
        import mx.controls.Text;
        import com.esri.ags.geometry.MapPoint;
        import com.esri.ags.events.PanEvent;

        private function mouseDownHandler(event:MouseEvent):void
        {
            if (!event.shiftKey)
            {
                myMap.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
            }
        }
        private function panStartHandler(event:PanEvent):void
        {
            myMap.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
        }
        private function mouseUpHandler(event:MouseEvent):void
        {
            myMap.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
            var mapPoint:MapPoint= myMap.toMapFromStage(event.stageX, event.stageY);
            myMap.infoWindow.label = "You clicked here";
            myMap.infoWindow.show( mapPoint ); // "Show the click"
        }
        
]]>
    
</mx:Script>
    
<esri:Map id="myMap" mouseDown="mouseDownHandler(event)" panStart="panStartHandler(event)">
    
<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
    
</esri:Map>
</mx:Application>


    PanEvent是ArcGIS Flex API中自定义的事件,继承了flash.events.Event,上面例子中所有事件的管理通过addEventListener和 removeEventListenser两个方法实现,并且通过鼠标对地图的点击动作的分解,实现在鼠标点击不同阶段的事件响应,属性信息的获取在 MouseUp阶段,toMapFromStage实现屏幕坐标到地图坐标的转换,并将结果显示在infoWindow中。

    具体的组件中,ArcGISTiledMapServiceLayer和ArcGIS Javascript API中的功能相同,将缓存好的地图服务添加到页面上,"esri"是一个标识符,在mxml页面最上方"xmlns:esri="http://www.esri.com/2008/ags"申明,用以在mxml中使用已定义好的组件。

    ArcGIS Flex API Events Demo包含了常用的一些事件,可以作为参考学习。从下面例子可以了解到,图层加载、图层添加删除、地图放大缩小、地图平移等都被ArcGIS Flex API Events进行了封装,加上原有的鼠标事件就可以基本满足WebGIS应用要求了。

ContractedBlock.gifExpandedBlockStart.gifCode
<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    
xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:esri
="http://www.esri.com/2008/ags" 
    pageTitle
="Event handling" 
    layout
="absolute" 
    creationComplete
="onApplicationCreationComplete()" 
    
>
    
<mx:Script>
        
<![CDATA[
            import flash.geom.Point;
            import com.esri.ags.events.LayerEvent;
            import com.esri.ags.events.ExtentEvent;
            import com.esri.ags.events.MapEvent;
            import com.esri.ags.events.PanEvent;
            import com.esri.ags.events.ZoomEvent;
            import com.esri.ags.geometry.MapPoint;
            import mx.events.FlexEvent;

            [Bindable] private var mapCoordX : Number = 0;
            [Bindable] private var mapCoordY : Number = 0;
            [Bindable] private var pixelCoordX : Number = 0;
            [Bindable] private var pixelCoordY : Number = 0;

            private function onMouseMove( event : MouseEvent ) : void
            {
                if (my Map.loaded)
                {
                    var mapPoint : MapPoint = myMap.toMapFromStage(event.stageX, event.stageY);
                    mapCoordX = mapPoint.x;
                    mapCoordY = mapPoint.y;
                    var mapLocalPixelPoint : Point = myMap.globalToLocal( new Point(event.stageX, event.stageY) );
                    pixelCoordX = mapLocalPixelPoint.x;
                    pixelCoordY = mapLocalPixelPoint.y;
                }
            }

            public function onApplicationCreationComplete():void
            {
                // Map Navigation Events
                myMap.addEventListener(ExtentEvent.EXTENT_CHANGE, logExtentEvent);
                myMap.addEventListener(PanEvent.PAN_START, logPanEvent);
                myMap.addEventListener(PanEvent.PAN_UPDATE, logPanEvent);
                myMap.addEventListener(PanEvent.PAN_END, logPanEvent);
                myMap.addEventListener(ZoomEvent.ZOOM_START, logZoomEvent);
                myMap.addEventListener(ZoomEvent.ZOOM_UPDATE, logZoomEvent);
                myMap.addEventListener(ZoomEvent.ZOOM_END, logZoomEvent);
                myMap.addEventListener(MouseEvent.CLICK, logMouseEvent);
                myMap.addEventListener(MouseEvent.DOUBLE_CLICK, logMouseEvent);
                myMap.addEventListener(MouseEvent.MOUSE_WHEEL, logMouseEvent);
                myMap.addEventListener(MapEvent.LAYER_ADD, logMapEvent);
                myMap.addEventListener(MapEvent.LAYER_REORDER, logMapEvent);
                myMap.addEventListener(MapEvent.LOAD, logMapEvent);
                aims.addEventListener(LayerEvent.LOAD, logLayerEvent);
                log.text = "2. Application creation complete\n" + log.text;
            }

            public function onMapCreationComplete():void
            {
                myMap.infoWindow.addEventListener(FlexEvent.HIDE, logInfoWindowFlexEvent);
                myMap.infoWindow.label = "Clicking the 'x' will \nthrow 'hide' event";
                // put the infoWindow in the middle of the map
                var myPoint:MapPoint = new MapPoint(0,0);
                myMap.infoWindow.show(myPoint);
                log.text = "1. Map creation complete\n" + log.text;
            }

            public function logInfoWindowEvent(event:Event):void
            {
                log.text = "* Event (infoWindow): " + event.type + "\n" + log.text;
            }

            public function logInfoWindowFlexEvent(event:FlexEvent):void
            {
                log.text = "* FlexEvent (infoWindow): " + event.type + "\n" + log.text;
            }

            public function logMouseEvent(event:MouseEvent):void
            {
                log.text = "* MouseEvent: " + event.type + "\n" + log.text;
            }

            public function logExtentEvent(event:ExtentEvent):void
            {
                log.text = "* ExtentEvent: " + event.type + "\n" + log.text;
            }

            public function logPanEvent(event:PanEvent):void
            {
                log.text = "* PanEvent: " + event.type + "\n" + log.text;
            }

            public function logZoomEvent(event:ZoomEvent):void
            {
                log.text = "* ZoomEvent: " + event.type + "\n" + log.text;
            }

            public function logMapEvent(event:MapEvent):void
            {
                log.text = "* MapEvent: " + event.type + "\n" + log.text;
            }

            public function logLayerEvent(event:LayerEvent):void
            {
                log.text = "* LayerEvent: " + event.type + "\n" + log.text;
            }
        
]]>
    
</mx:Script>

    
<mx:HDividedBox width="100%" height="100%">
        
<esri:Map id="myMap"
            mouseMove
="onMouseMove(event)"
            crosshairVisible
="true"
            creationComplete
="onMapCreationComplete()"
            
>
            
<esri:extent>
                
<esri:Extent xmin="-45" ymin="-45" xmax="45" ymax="45">
                    
<esri:SpatialReference wkid="4326"/>
                
</esri:Extent>
            
</esri:extent>
            
<esri:ArcIMSMapServiceLayer id="aims" creationComplete="log.text='MapLayer creation complete\n'+log.text;" load="log.text='MapLayer loaded\n'+log.text;"
                serviceHost
="http://www.geographynetwork.com"
                serviceName
="ESRI_Time"
                
/>
            
<esri:GraphicsLayer visible="true" creationComplete="log.text='GraphicLayer creation complete\n'+log.text;" load="log.text='GraphicLayer loaded\n'+log.text;">
                
<esri:Graphic toolTip="-70.488281,41.660156" visible="true">
                    
<esri:geometry>
                        
<esri:MapPoint x="-70.488281" y="41.660156" spatialReference="{new SpatialReference(4326)}"/>
                    
</esri:geometry>
                    
<esri:symbol>
                        
<esri:SimpleMarkerSymbol id="symbol" color="0xFF0000" size="10" alpha="0.75"/>
                    
</esri:symbol>
                
</esri:Graphic>
            
</esri:GraphicsLayer>
        
</esri:Map>
        
<mx:Panel layout="vertical" height="100%">
            
<mx:Text width="250" text="You can listen to many different events both our Map Navigation specific events, as well as general Flex events."/>
            
<mx:TextArea width="100%" height="100%" id="log"/>
            
<mx:HBox borderStyle="solid">
                
<mx:Label text="Pixel x: {pixelCoordX}" paddingBottom="0"/>
                
<mx:Label text="Pixel y: {pixelCoordY}" paddingBottom="0"/>
            
</mx:HBox>
            
<mx:HBox borderStyle="solid">
                
<mx:Label text="Map x: {mapCoordX.toFixed(4)}" paddingBottom="0"/>
                
<mx:Label text="Map y: {mapCoordY.toFixed(4)}" paddingBottom="0"/>
            
</mx:HBox>
            
<mx:Label text="spatial reference: {myMap.spatialReference.wkid}"/>
        
</mx:Panel>
    
</mx:HDividedBox>
</mx:Application>

转载于:https://www.cnblogs.com/flyingis/archive/2008/12/07/1349751.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/463659.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++11 bind注意事项(传引用参数的时候)

默认情况下&#xff0c;bind的那些不是占位符的参数被拷贝到bind返回的可调用对象中。 当需要把对象传到bind中的参数中时&#xff0c;需要使用ref或者cref。 例如&#xff1a;

四元數與旋轉

为什么80%的码农都做不了架构师&#xff1f;>>> 在討論「四元數」之前&#xff0c;我們來想想對三維直角座標而言&#xff0c;在物體旋轉會有何影響&#xff0c;可以擴充三維直角座標系統的旋轉為三角度系統&#xff08;Three-angle system&#xff09;&#xff0c…

玩一下数组

来源&#xff1a;嵌入式大杂烩数组是最基本的数据结构&#xff0c;关于数组的面试题也屡见不鲜&#xff0c;本文罗列了一些常见的面试题&#xff0c;仅供参考。目前有以下18道题目。数组求和求数组的最大值和最小值求数组的最大值和次大值求数组中出现次数超过一半的元素求数组…

将GDB中的输出定向到文件

将所有栈信息保存到文件11中 在gdb中: set logging file 11 set logging on thread apply all bt set logging off 结束之后&#xff0c;在相关目录下查看11文件

不生孩子能怎么办?

你会选择不婚或者丁克的生活吗&#xff1f;你是否也想过未来养老的问题呢&#xff1f;如果想过&#xff0c;你对此又有什么规划呢&#xff1f;欢迎留言讨论&#xff01;本文原创公众号&#xff1a;不会笑青年&#xff0c;授权转载请联系微信(laughyouth369)&#xff0c;授权后&…

__attribute__((always_inline))

__attribute__((always_inline))的意思是强制内联&#xff0c;所有加了__attribute__((always_inline))的函数再被调用时不会被编译成函数调用而是直接扩展到调用函数体内&#xff0c;例子如下&#xff1a; define inline __attribute((always_inline))的意思就是用 inline 代…

应用程序池优化配置方案(IIS7、IIS7.5)

定义&#xff1a; 是将一个或多个应用程序链接到一个或多个工作进程集合的配置&#xff0c;该池中的应用程序与其他应用程序被工作进程边界分隔&#xff0c; 一、一般优化方案 1.基本设置 【1】队列长度&#xff1a;默认1000&#xff0c;将原来的队列长度65535 【2】启动32位应…

深圳的房价跌了

我很久没有关注深圳的房价了&#xff0c;上一篇关于深圳房价的文章好像还是几个月之前的&#xff0c;几个月之前&#xff0c;我一个同学买房&#xff0c;跟我咨询了下&#xff0c;然后就写了一篇文章。现在不要着急买房这篇文章从那个时候到现在已经一年了&#xff0c;前几天跟…

Springboot 使用Mybatis对postgreSQL实现CRUD

目录结构 1、创建一个springboot项目 选择Web、Mabatis、postgreSQL 2、在application中写入配置文件 1 #配置数据源 2 spring.datasource.platformpostgres 3 spring.datasource.urljdbc:postgresql://127.0.0.1:5432/postgres 4 spring.datasource.usernamepostgres 5 spring…

不得不说,这是我面过的最优秀的Linux运维!

Linux可以说是运维之“本”。无论中小企业还是大厂&#xff0c;现在的企业有95%甚至更多是使用Linux服务器。而对于Linux运维来说&#xff0c;Linux基础越扎实、会的工具越多&#xff0c;能解决的问题就越多&#xff0c;技术也能走的更远。Linux&#xff0c;甚至可以说是进入IT…

一个中科大「差生」的8年程序员工作总结

今年终于从大菊花厂离职了&#xff0c;离职前收入大概60w不到吧&#xff01;在某乎属于比较差的&#xff0c;今天终于有空写一下自己的职场故事&#xff0c;也算是给自己近8年的工作做个总结复盘。近8年有些事情做对了&#xff0c;也有更多事情做错了&#xff0c;在这里记录一下…

Java IO File

#file file的一些方法&#xff0c;因为windows和Linux开发环境的问题&#xff0c;在file中最好统一用 / 输出流操作 转载于:https://www.cnblogs.com/cykfory/p/10294981.html

gtest使用例子

最近使用gtest进行单元测试&#xff0c;采用打桩的形式。关于gtest的详细说明就不多说了&#xff0c;网上的资料一大堆。主要讲解使用时的参数如何配置以及遇到的问题。下面的例子模拟是加、减、乘、除四则运算&#xff0c;前提是不知道加、减、乘、除四则运算是如何实现的。 …

游戏开发中的数学和物理算法(7):角度 vs 弧度

我们通常使用的笛卡尔坐标系统&#xff0c;角点通常在(0,0),即原点。初始边在x轴正半轴&#xff0c;终边与初始边成夹角。初始边逆时针旋转为正值&#xff0c;顺时针旋转为逆值。数学表示&#xff1a;角度&#xff1a;degreeradian*180/π 弧度&#xff1a;radiandegree*π/18…

一个小老板的春天

大家周末好继续之前说的采访专栏&#xff0c;前两天和一个做生意的朋友聊天&#xff0c;总结了一些内容分享给大家&#xff0c;觉得不错的点赞收藏起来&#xff0c;可能后面你自己当老板了会用到。我这个老板的名字和公司名字我就不说出来了&#xff0c;他现在做的是细分领域&a…

SharePoint GridView的使用2——DataSourceView的使用

首先创建一个abstract类&#xff0c;继承Microsoft.SharePoint.WebControls.DataTableDataSourceView。之后基于这个类可以创建多个显示不同数据的的DataSourceView&#xff0c;在上文的DataSource控件中有个ViewName属性&#xff0c;可以通过这个属性来区分不同的DataSourceVi…

我在ARM板上写的第一个驱动程序

有时大家喜欢拿电灯来当作笑谈&#xff0c;实际上点灯包含多内容很多&#xff0c;如下这篇文章就是关于嵌入式Linux点灯多技术栈&#xff0c;推荐给大家。摘要&#xff1a;搞嵌入式有两个方向&#xff0c;一个是嵌入式软件开发(MCU方向)&#xff0c;另一个是嵌入式软件开发(Lin…

string、char *、char []之间的相互转换

最近工作中遇到了string、char *、char []之间的相互转换&#xff0c;今天终于抽出时间将他们之间的转换记录下来&#xff0c;使用的是CodeBlocks软件&#xff0c;编译器为GNU GCC compiler&#xff0c;下面看代码&#xff1a; #include <iostream> #include <stdio.…

C语言中匿名的最高境界

C语言中有没有见过(int [2]){19,20}或者int (*pt2)[4]的使用方法&#xff0c;字面上可能不好理解&#xff0c;这是C99之后才新增的知识点&#xff0c;名为复合型表述Compound Literals&#xff0c;一旦熟悉使用&#xff0c;便会体会到它简洁而强大的表达。什么是”复合型表述“…

codeblocks安装后提示找不到编译器

安装了自带编译器的codeblocks&#xff0c;但是打开后提示没有找到compiler&#xff0c; 经过几分钟的搜索&#xff0c;找了原因&#xff1a; 打开codeblocks&#xff0c;进入settings->compiler&#xff0c;选择如下: 然后&#xff0c;选择Toolchain executables&#xff…