ARCGIS SERVER FROM FLEX 实现饼状图或者柱状图
FLEX画图之各种柱状图饼状图画法
先上几张图代码如下 flex4.5<?xml version="1.0" encoding="utf-8"?><s:Application xmlns:fx="/mxml/2009"xmlns:s="library:///flex/spark"xmlns:mx="library:///flex/mx" width="100%" height="100%" creationComplete="init()" ><fx:Script><![CDATA[/*** 5.扇形图*/import mx.events.FlexEvent;import mx.states.AddChild;private var sector:Sprite=new Sprite();private function drawSector(x:Number, y:Number, r:Number, R:Number, angle:Number, startA:Number):void{sector.graphics.clear();sector.graphics.lineStyle(1,0,1,true);sector.graphics.beginFill(0,0.5);if(Math.abs(angle)>360){angle=360;}var n:Number=Math.ceil(Math.abs(angle)/45);var angleA:Number=angle/n;angleA=angleA*Math.PI/180;startA=startA*Math.PI/180;var startB:Number=startA;sector.graphics.moveTo(x+r*Math.cos(startA),y+r*Math.sin(startA)) ;sector.graphics.lineTo(x+R*Math.cos(startA),y+R*Math.sin(startA)) ;for(var i:int=1;i<n;i++){startA+=angleA;var angleMid1:Number=startA-angleA/2;var bx:Number=x+R/Math.cos(angleA/2)*Math.cos(angleMid1);varby:Number=y+R/Math.cos(angleA/2)*Math.sin(angleMid1);var cx:Number=x+R*Math.cos(startA);var cy:Number=y+R*Math.sin(startA);sector.graphics.curveTo(bx, by, cx, cy);}// 内圆起点sector.graphics.lineTo(x+r*Math.cos(startA),y+r *Math.sin(startA));// 内圆弧for (var j:int=n;j>1;j--){startA-=angleA;var angleMid2:Number=startA+angleA/2;varbx2:Number=x+r/Math.cos(angleA/2)*Math.cos(angleMid2);varby2:Number=y+r/Math.cos(angleA/2)*Math.sin(angleMid2);var cx2:Number=x+r*Math.cos(startA);var cy2:Number=y+r*Math.sin(startA);sector.graphics.curveTo(bx2, by2, cx2, cy2);}//内圆终点sector.graphics.lineTo(x+r*Math.cos(startB),y+r*Math.sin(startB));//完成sector.graphics.endFill();}protected function button1_clickHandler():void{drawSector(200,200,50,100,-105,-30);con.addChild(sector);}/************************************************************************ *********** 6.环形分块图*********************************************************************** ***********/import mx.effects.easing.*;import mx.charts.series.items.PieSeriesItem;import mx.charts.events.ChartItemEvent;private functionpieChart_itemClick(evt:ChartItemEvent):void {var item:PieSeriesItem = evt.hitData.chartItem as PieSeriesItem;var degrees:Number = radiansToDegrees(item.startAngle);var arr:Array = [];if (checkBox.selected) {arr[item.index] = 0.2;}pieSeries.perWedgeExplodeRadius = arr;pieSeries.startAngle -= degrees;dp.refresh();}private function radiansToDegrees(radians:Number):Number { return radians * (180 / Math.PI);}[Bindable]private var arr:Array = [{id:1,city:'北京',money:1000,pay:300},{id:2,city:'上海',money:1200,pay:500},{id:3,city:'天津',money:800,pay:200}];import mx.charts.chartClasses.IAxis;import mx.formatters.CurrencyFormatter;/*** 7.flex 画线 1*/private var currFormatter:CurrencyFormatter;private function init():void {currFormatter = new CurrencyFormatter();currFormatter.precision = 2;}private function linearAxis_labelFunc(item:Object, previousValue:Object, axis:IAxis):String {currFormatter = new CurrencyFormatter();currFormatter.precision = 2;return currFormatter.format(item);}private function lineChart_creationComplete():void {var linearAxisMinimum:int =Math.floor(putedMinimum);var linearAxisMaximum:int =Math.ceil(putedMaximum);linearAxis.minimum = linearAxisMinimum;linearAxis.maximum = linearAxisMaximum;}/*** 8.flex 画线 2*/import mx.charts.CategoryAxis;import mx.charts.chartClasses.IAxis;private function categoryAxis_labelFunc(item:Object, prevValue:Object, axis:CategoryAxis, categoryItem:Object):String { var datNum:Number = Date.parse(item);var tempDate:Date = new Date(datNum);return tempDate.date.toString();}import mx.charts.series.items.PieSeriesItem;import mx.charts.HitData;import mx.utils.StringUtil;private function pieSeries_labelFunc(item:Object,field:String, index:Number, percentValue:Number):String {return StringUtil.substitute("{0} ({1}%)",item.@label,percentValue.toFixed(1));}]]></fx:Script><fx:Declarations><mx:XMLListCollection id="dp"><fx:XMLList><product label="Product 1" data="3" /><product label="Product 2" data="1" /><product label="Product 3" data="4" /><product label="Product 4" data="1" /><product label="Product 5" data="5" /><product label="Product 6" data="9" /></fx:XMLList></mx:XMLListCollection></fx:Declarations><fx:Declarations><mx:XMLListCollection id="dpLine"><mx:source><fx:XMLList><quote date="8/27/2007" open="40.38" close="40.81" /><quote date="8/24/2007" open="40.5" close="40.41" /><quote date="8/23/2007" open="40.82" close="40.6" /><quote date="8/22/2007" open="40.4" close="40.77" /><quote date="8/21/2007" open="40.41" close="40.13" /><quote date="8/20/2007" open="40.55" close="40.74" /><quote date="8/17/2007" open="40.18" close="40.32" /><quote date="8/16/2007" open="39.83" close="39.96" /><quote date="8/15/2007" open="40.22" close="40.18" /><quote date="8/14/2007" open="41.01" close="40.41" /><quote date="8/13/2007" open="41" close="40.83" /><quote date="8/10/2007" open="41.3" close="41.06" /><quote date="8/9/2007" open="39.9" close="40.75" /><quote date="8/8/2007" open="39.61" close="40.23" /><quote date="8/7/2007" open="39.08" close="39.42" /><quote date="8/6/2007" open="38.71" close="39.38" /><quote date="8/3/2007" open="39.47" close="38.75" /><quote date="8/2/2007" open="39.4" close="39.52" /><quote date="8/1/2007" open="40.29" close="39.58" /> </fx:XMLList></mx:source></mx:XMLListCollection></fx:Declarations><fx:Declarations><mx:XMLListCollection id="dpLine2"><mx:source><fx:XMLList><quote date="8/1/2007" open="40.29" close="39.58" /><quote date="8/2/2007" open="39.4" close="39.52" /><quote date="8/3/2007" open="39.47" close="38.75" /><quote date="8/6/2007" open="38.71" close="39.38" /><quote date="8/7/2007" open="39.08" close="39.42" /><quote date="8/8/2007" open="39.61" close="40.23" /><quote date="8/9/2007" open="39.9" close="40.75" /><quote date="8/10/2007" open="41.3" close="41.06" /><quote date="8/13/2007" open="41" close="40.83" /><quote date="8/14/2007" open="41.01" close="40.41" /><quote date="8/15/2007" open="40.22" close="40.18" /><quote date="8/16/2007" open="39.83" close="39.96" /><quote date="8/17/2007" open="40.18" close="40.32" /><quote date="8/20/2007" open="40.55" close="40.74" /><quote date="8/21/2007" open="40.41" close="40.13" /><quote date="8/22/2007" open="40.4" close="40.77" /><quote date="8/23/2007" open="40.82" close="40.6" /><quote date="8/24/2007" open="40.5" close="40.41" /><quote date="8/27/2007" open="40.38" close="40.81" /> </fx:XMLList></mx:source></mx:XMLListCollection></fx:Declarations><fx:Declarations><mx:XMLListCollection id="dp4"><mx:source><fx:XMLList><product label="Product 1" data="3" data1="2"/><product label="Product 2" data="6" data1="7"/><product label="Product 3" data="4" data1="5"/><product label="Product 4" data="1" data1="2"/><product label="Product 5" data="3" data1="1"/><product label="Product 6" data="6" data1="4"/> </fx:XMLList></mx:source></mx:XMLListCollection></fx:Declarations><s:layout><s:BasicLayout/></s:layout><mx:Canvas width="100%" height="100%"horizontalScrollPolicy="off"><mx:VBox width="100%" height="100%"horizontalScrollPolicy="auto" ><mx:HBox><!--1.添加一个最简单的柱状图--><mx:BarChart x="110" y="27" id="barchart1"dataProvider="{arr}" showDataTips="true" selectionMode="single"><mx:series><mx:BarSeries displayName="收入" xField="money" /><mx:BarSeries displayName="支出" xField="pay" /></mx:series><mx:verticalAxis><mx:CategoryAxis categoryField="city" /></mx:verticalAxis></mx:BarChart><mx:Legend dataProvider="{barchart1}"/><!--2.在上面例子的基础上,添加一个特效,就是图表默认是半透明的,在鼠标移到图标上时渐变为不透明,移开时渐变为半透明--><mx:BarChart alpha="0.5" x="110" y="27" id="barchart2" dataProvider="{arr}" showDataTips="true" selectionMode="single"><mx:series><mx:BarSeries displayName="收入" xField="money" /><mx:BarSeries displayName="支出" xField="pay" /></mx:series><mx:verticalAxis><mx:CategoryAxis categoryField="city" /></mx:verticalAxis><mx:rollOverEffect><s:Fade alphaFrom="0.5" alphaTo="1"duration="1000" /></mx:rollOverEffect><mx:rollOutEffect><s:Fade alphaFrom="1" alphaTo="0.5"duration="1000" /></mx:rollOutEffect></mx:BarChart><mx:Legend dataProvider="{barchart1}"/></mx:HBox><mx:HBox><!--3.添加一个最简单的饼状图--><mx:PieChart x="110" y="51" id="piechart1"dataProvider="{arr}" showAllDataTips="true" selectionMode="single"><mx:series><mx:PieSeries displayName="Series 1"field="money" labelPosition="callout" labelField="city"nameField="city" /></mx:series></mx:PieChart><mx:Legend dataProvider="{piechart1}"direction="horizontal" labelPlacement="right" /><!--4.添加一个竖版柱状图--><mx:ColumnChart x="100" y="90" id="columnchart1" dataProvider="{arr}" showDataTips="true" selectionMode="single"><mx:horizontalAxis><mx:CategoryAxis categoryField="city" /></mx:horizontalAxis><mx:series><mx:ColumnSeries displayName="收入"yField="money"/><mx:ColumnSeries displayName="支出" yField="pay"/></mx:series></mx:ColumnChart><mx:Legend dataProvider="{columnchart1}"/></mx:HBox><mx:HBox><s:Button label="按钮" click="button1_clickHandler()"/> </mx:HBox><mx:HBox><!--6.环形分块图--><mx:ApplicationControlBar dock="true"><mx:CheckBox id="checkBox"label="Use perWedgeExplodeRadius:"labelPlacement="left"selected="true" /></mx:ApplicationControlBar><mx:PieChart id="pieChart"dataProvider="{dp}"showDataTips="true"itemClick="pieChart_itemClick(event);"height="100%"width="100%" ><mx:series><mx:PieSeries id="pieSeries"field="@data"nameField="@label"><mx:showDataEffect><mx:SeriesInterpolate duration="1500"easingFunction="{Elastic.easeOut}" /></mx:showDataEffect><mx:filters><mx:DropShadowFilter/></mx:filters></mx:PieSeries></mx:series></mx:PieChart><mx:Legend dataProvider="{pieChart}"direction="horizontal" /></mx:HBox><mx:HBox><!--7.flex 画线 1--><mx:ApplicationControlBar dock="true"><mx:Form styleName="plain"><mx:FormItem label="minimum:"><mx:HSlider id="minSlider"minimum="28"maximum="38"value="38"liveDragging="true"snapInterval="1"change="linearAxis.minimum = event.value;" /></mx:FormItem><mx:FormItem label="maximum:"><mx:HSlider id="maxSlider"minimum="42"maximum="52"value="42"liveDragging="true"snapInterval="1"change="linearAxis.maximum = event.value;" /></mx:FormItem></mx:Form><mx:Spacer width="100%" /><mx:Legend dataProvider="{lineChart}"direction="horizontal" /></mx:ApplicationControlBar><mx:LineChart id="lineChart"showDataTips="true"dataProvider="{dpLine}"width="100%"height="100%"creationComplete="lineChart_creationComplete();"><mx:backgroundElements><mx:GridLines id="gridLines"verticalTickAligned="false"><mx:verticalStroke><mx:SolidColorStroke color="haloSilver"weight="0"alpha="1.0" /></mx:verticalStroke><mx:horizontalStroke><!-- Set alpha to 0 so stroke isn't visible. --><mx:SolidColorStroke color="white"weight="0"alpha="0.0" /></mx:horizontalStroke><mx:horizontalFill><mx:SolidColor color="haloSilver"alpha="0.1" /></mx:horizontalFill></mx:GridLines></mx:backgroundElements><!-- vertical axis --><mx:verticalAxis><mx:LinearAxis id="linearAxis"baseAtZero="false"title="Price (USD)"minorInterval="0.10"interval="0.5"labelFunction="linearAxis_labelFunc" /></mx:verticalAxis><!-- horizontal axis --><mx:horizontalAxis><mx:CategoryAxis id="ca"categoryField="@date"title="Date" /></mx:horizontalAxis><!-- horizontal axis renderer --><mx:horizontalAxisRenderers><mx:AxisRenderer axis="{ca}"canDropLabels="true" /></mx:horizontalAxisRenderers><!-- series --><mx:series><mx:LineSeries yField="@open"displayName="Open" /></mx:series></mx:LineChart></mx:HBox><mx:HBox><!--8.flex 画线 2--><mx:ApplicationControlBar dock="true"><mx:Form styleName="plain"><mx:FormItem label="direction:"><mx:ComboBox id="comboBox"><mx:dataProvider><fx:Array><fx:Object label="both" /><fx:Object label="horizontal" /><fx:Object label="vertical" /></fx:Array></mx:dataProvider></mx:ComboBox></mx:FormItem><mx:FormItem label="horizontalTickAligned:"><mx:CheckBox id="hCheckBox" selected="true" /></mx:FormItem><mx:FormItem label="verticalTickAligned:"><mx:CheckBox id="vCheckBox" selected="true" /></mx:FormItem></mx:Form></mx:ApplicationControlBar><mx:LineChart id="lineChart2"showDataTips="true"dataProvider="{dpLine2}"width="100%"height="100%"><!-- background elements --><mx:backgroundElements><mx:GridLineshorizontalTickAligned="{hCheckBox.selected}"verticalTickAligned="{vCheckBox.selected}"><mx:horizontalFill><mx:SolidColor color="haloBlue"alpha="0.2" /></mx:horizontalFill><mx:horizontalAlternateFill><mx:SolidColor color="haloSilver"alpha="0.2" /></mx:horizontalAlternateFill><mx:verticalFill><mx:SolidColor color="haloBlue"alpha="0.2" /></mx:verticalFill><mx:verticalAlternateFill><mx:SolidColor color="haloSilver"alpha="0.2" /></mx:verticalAlternateFill></mx:GridLines></mx:backgroundElements><!-- vertical axis --><mx:verticalAxis><mx:LinearAxis baseAtZero="false"title="Price"labelFunction="linearAxis_labelFunc" /></mx:verticalAxis><!-- horizontal axis --><mx:horizontalAxis><mx:CategoryAxis id="ca1"categoryField="@date"title="August 2007"labelFunction="categoryAxis_labelFunc" /></mx:horizontalAxis><!-- horizontal axis renderer --><mx:horizontalAxisRenderers><mx:AxisRenderer axis="{ca}" canDropLabels="true" /></mx:horizontalAxisRenderers><!-- series --><mx:series><mx:LineSeries yField="@open" displayName="Open" /><mx:LineSeries yField="@close"displayName="Close" /></mx:series><!-- series filters --><mx:seriesFilters><fx:Array/></mx:seriesFilters></mx:LineChart></mx:HBox><mx:HBox><mx:Canvas styleName="opaquePanel"width="700" height="420" borderColor="#600EE9" borderStyle="none"><mx:PieChart id="pieChart3"dataProvider="{dp4}"showDataTips="true"height="253"width="346" themeColor="#0A98F2" left="0" top="0"><mx:series><mx:PieSeries id="pieSeries3"field="@data"nameField="@label"visible="false" /><!--最里面的空白饼图,图例的显示就是根据该饼图,所以必须有数据,但可以设置visible=false --><mx:PieSeries id="pieSeries1"field="@data1"nameField="@label"labelPosition="callout"labelFunction="pieSeries_labelFunc" /><!--最里面显示的饼图 --><mx:PieSeries id="pieSeries2" /><!--外面空白的饼图 --><mx:PieSeries id="pieSeries4"field="@data"nameField="@label"labelPosition="callout" /><!--最外层显示的饼图 --></mx:series></mx:PieChart><mx:Legend dataProvider="{pieChart}"direction="horizontal"horizontalGap="100"width="98" x="416" y="35"borderStyle="none" borderThickness="3" borderColor="#078CE9"/></mx:Canvas></mx:HBox></mx:VBox></mx:Canvas><!--5.扇形图--><s:SpriteVisualElement id="con" x="216" y="146" width="480"height="312"/></s:Application>。
FlexforArcGIS
ArcGIS for Flex 使用案例
发布篇
打开ArcGIS Manager(我这里用的是ArcGIS Server 9.3.1 for Java Platform),选择Add New Service
图一
为你的服务起个名字:
图二
点击下一步,选择你的地图文件:
图三
图四
图五注意这里使用的是ArcGIS Server File System.
选择你发布的服务类型,我们这里选择WMS(Web Map Service)
图六
后面的步骤就一直点Next直到Finish
图七
点击Finish之后可以再管理界面中看到我们刚刚发布的地图服务:
图八
我们打开开始菜单中的ArcGIS\ArcGIS Server for the Java Platform\ArcGIS Services Directory可以看到我们刚刚发布的服务:
图九
在这里要注意一下,如果页面中没有你发布的地图服务,可以去http://{你的主机名称}:8399/arcgis/rest/admin/中清理一下,账号密码即为你登陆Manager的账号密码即可:
图十
图十一
清理过之后即可在ArcGIS Services Directory找到你的服务, 点击你的服务进入界面如下:
图十二
其实这些我们暂时都不用管,重点是将URL地址复制下来(给大家开个玩笑呵呵)
图十三
使用篇
打开Flash Builder(Flex Builder),新建一个Application, 将agslib引入进来
图十四成功引入后,会在你的组件库中出现ESRI的组件库:。
ArcGIS-server-Flex编程的图解教程三篇.doc
ArcGIS-server-Flex编程的图解教程三篇第1条万维网地理信息系统是基于Flex和RESTArcGISServer发布和方法1简介的网络地理信息系统,是一种利用交互式网络技术扩展和完善地理信息系统的技术。
随着网络地理信息系统的发展,用户对其表现形式有了更多的期望。
与此同时,开发人员也希望有一个更加简洁和高度可扩展的架构。
基于瘦客户端和胖客户端的WebGIS技术可以分为两种方案。
在基于瘦客户端的方案中,客户端仅使用标准的网络技术,如超文本传输协议(HTTP、HTML)和Javascript。
胖客户端的挑战是通过下载和安装插件来增强浏览器的能力。
代表性的技术包括插件、ActiveX控件技术、JavaApplet技术和SVG技术。
瘦客户端的开发模式已经成为网络地理信息系统的主流开发模式。
基于B/S架构的网络地理信息系统发展迅速。
然而,随着互联网影响力的不断扩大和地理信息系统技术在各个行业的广泛应用,人们逐渐对当前网络地理信息系统网页技术的性能效果和交互性不满意,希望网络地理信息系统具有类似于C/S的性能效果和交互性RIA是新一代网络应用。
这个概念是由XXXX的Macromedia 首先提出的。
它将桌面应用程序的交互性和用户体验与传统网络应用程序的部署灵活性和成本分析相结合。
它具有无需刷新页面和提供快速界面响应的优点。
就用户体验而言,RIA有着光明的前景。
基于RIA客户端开发的新框架也不断涌现,如微软的Silverlight、Sun的JavaFX和Adobe的Flex。
Flex的优势是第一印象最持久。
根据XXXX奥多比公司在年底进行的一项调查,经过近十年的推广,FlashPlayer9已经安装在超过95台互联网电脑上,而且这个数字还在以每天100万台的速度增长。
Flex和REST的结合是最流行的分布式系统解决方案之一[1]。
将该方案应用于网络地理信息系统,可以方便地建立一个具有丰富表现力的网络地图应用程序。
基于ARCGIS SERVER和FLEX的城市服务信息系统研究与设计
胖客户端方案 中, 客户 端通过 下载插件 来增强浏 览器 的处 理能力 , Pu- ,aaA pe,ci 如 lgi Jv pl A t eX控件技术等 。其优点 是 n t v
A c I e e 是 一 个 基 于 We rG SSr r v b技 术 的 企业 级 G S G o I ( e. gahcIfr a o yt 解决方案 , rp i nom t nSs m) i e 为创建和 管理基于 服务器 的 GS应用提供 了一个高效的框架平台。它充分利用 了 A c I I rG S
0 引 言
We I bG S实现技 术 主要分 为瘦 客户 端 和胖客 户端 两种 方 案, 它们各有优缺点 J 。
1 相关技术概 述
本 文主要研究 一种基 于 A c I evr和 Fe rG SSre l x的城市 服务 信息系统的技术解决方案 , 并设计和实现一个原 型系统。鉴 此 ,
富互 I e t plao 结合了 以 h n m i tn 上两者的优点, 把传统网络应用程序和桌面程序结合起来 , 既提 供 了丰富 的客户 端体 验 , 又能 通过 网络 轻易 部署 , 其是基 于 尤 l 的 I F x RA技术 , e 只需在客户 端安装 F s l e 即可 。据 A o lh a r aPy d— b 官方调查显 示 , e 目前 9 % 以上 的计 算机 都安 装 了 F hl — 5 l Pa s a y
WebGIS经典例子
(一)ArcGIS.Server.9.3和ArcGIS API for Flex实现基本的地图浏览 2(二)ArcGIS.Server.9.3和ArcGIS API for Flex实现动态图层和瓦片图层叠加显示 5(三)ArcGIS.Server.9.3和ArcGIS API for Flex实现自己的Toc 控件8(四)ArcGIS.Server.9.3和ArcGIS API for Flex实现Toolbar功能 16(五)ArcGIS.Server.9.3和ArcGIS API for Flex实现GraphicsLayer上画点、线、面20(六)ArcGIS.Server.9.3和ArcGIS API for Flex实现Identify的功能图查属性25(七)ArcGIS.Server.9.3和ArcGIS API for Flex实现Query查询定位中心功能30(八)ArcGIS.Server.9.3和ArcGIS API for Flex实现MapTips37(九)ArcGIS.Server.9.3和ArcGIS API for Flex在MapTips显示饼图数据统计42(十)ArcGIS.Server.9.3和ArcGIS API for Flex的GeometryService和buffer分析49(十三)ArcGIS.Server.9.3和ArcGIS API for Flex的GeoprocessingServices和最短路径分析65(一)ArcGIS.Server.9.3和ArcGIS API for Flex实现基本的地图浏览目的:1.ArcGIS API for Flex实现在Flex程序中浏览自己的ArcGIS.Server.9.3中发布的地图,一个最基本的入门例子。
准备工作:1.在ArcGIS.Server.9.3发布一个叫usa的Map Service,并且把这个Service启动起来。
arcgis专题图制作(饼图)
现在需要制作2005年太湖流域污染物排放量空间分布图,要求如下:
1、以地级市为单位,画污染物排放量饼状图(饼分为三块:工业污染源、生活污染源、面源污染源)
2、饼大小以污染物排放量相关。
测试数据:
地市工业污染源生活污染源面源污染源
苏州100 80 150
无锡 80 50 130
常州 60 40 70
镇江 20 15 30
ArcGIS中专题图制作步骤:
1、在ArcCatalog中新建一个shapefile,命名为“地级市.shp”。
并添加三个
字段:工业污染源、生活污染源、面源污染源。
2、在ArcMap中编辑地级市的位置到“地级市.shp”,并编辑工业污染源、生活污染源、面源污染源这三个字段的具体数值。
3、在ArcMap中设置“地级市”图层属性,选择“Symbology”页。
选择Show为Charts:Pie,添加如上三个字段,并选择好颜色方案。
4、设置饼状图中饼的大小。
此时注意选择第2种Variation Type,这样饼的大小会与字段数值之和关联。
同时还要设置一下下面的Size来控制饼的大小。
5、合理进行设置后产生的效果图。
6、当然可以在Layout下面添加图例等地图基本要素。
ArcGIS For Flex 地图联动
ArcGIS For Flex 地图联动2013年4月制定及修订记录目录1地图联动介绍是针对Map对象,利用观察者模式,当鼠标进入某一Map时,此Map对象成为主体,其他的Map对其进行观察,若其当前视图范围改变,其他Map随其而动,同时取消对该Map对象的监听。
2具体实现Map对象具有EXTENT_CHANGE事件(com.esri.ags.events.ExtentEvent中),监听此事件进行观察。
3具体代码package Hymn{import com.esri.ags.Map;import com.esri.ags.events.ExtentEvent;import flash.events.MouseEvent;public class LinkingMethodsClass{public function LinkingMethodsClass(){MapItems = new Array();}private var MapItems:Array;/**<p>功能:添加需要联动地图对象。
</p><p>参数:MapItem Map对象</p><p>返回值:无</p>*/public function AddMap(MapItem:Map):voidfor each(var Mapadded:Map inthis.MapItems){if(Mapadded == MapItem){return;}}MapItems.push(MapItem);AddLinkingStartFunction(MapItem);}private function AddLinkingStartFunction(MapItem:Map):void{MapItem.addEventListener(MouseEvent.MOUSE_OVER,CheckExtentStartFunction);}private function CheckExtentStartFunction(event:MouseEvent):void{var MapItem:Map = event.currentTarget as Map;addLinkingFunction(MapItem);}private function addLinkingFunction(MapItem:Map):void{MapItem.addEventListener(ExtentEvent.EXTENT_CHANGE,DoLinkingFunction);}private function DoLinkingFunction(event:ExtentEvent):void{var MapItem:Map = event.currentTarget as Map;RemoveLinkingFunction();addLinkingFunction(MapItem);for each(var MapValue:Map inthis.MapItems){if(MapValue!=MapItem){MapValue.extent = MapItem.extent;}}}private function RemoveLinkingFunction():void{for each(var MapItem:Map inthis.MapItems){MapItem.removeEventListener(ExtentEvent.EXTENT_CHANGE,DoLinkingFunction);}}}4应用示例新建Flex工程后,将以下代码粘贴覆盖主运行程序中的代码。
arcgisapiforflex开发入门(一)环境搭建2003
arcgisapiforflex开发入门(一)环境搭建2003
上一篇/下一篇2022-10-1410:50:40/个人分类:muhup查看(2737)/
评论(12)/评分(29/0)
Server建立漂亮的富互联网应用程序
richinternetapplication(RIA),优
点是运行速度快,用户体验效果会比目前的WEBGIS好。
使用arcgiapiforfle某可以达到下面的效果1,显示你的地图数据并可以和数
据交互2,在服务器上执行空间处理模型并显示结果3,基于ArcGISOnline上的底图显示你自己的数据4,根据属性或者位置查找你的
数据并显示结果5,查找地址并显示结果6,用创新的方式可视化结果7,创建mahup具体详情可以参考
面有一些例子。
安装好fle某builder之后会安装fle某dk3,所以就不用自己手工
安装了。
第一个arcgiapiforfle某程序。
1,打开fle某builder,创建一个fle某工程(名称Demo)。
2,右键单击工程名,选择属性,在属性对话框中选择fle某buildpath,选择
境就配置好了。
3,在Demo.m某ml文件中输入下面这代码
pageTitle=\
Onlineervice\tyleName=\
_World_2D/MapServer\
编译,执行。
第一个简单的agfle某程序就写好了。
效果如图2 Flah:
注:文章部分内容参考了以下文章
Flah:demo。
ArcGIS API for Flex学习一
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="/2006/mxml" xmlns:esri="/2008/ags" pageTitle="Using ArcGIS API for Flex to connect to a cached ArcGIS Online service" styleName="plain"> <esri:Map crosshairVisible="true"> <esri:ArcGISTiledMapServiceLayer url="/ArcGIS/ rest/services/ESRI_StreetMap_World_2D/MapServe r" /> </esri:Map> </mx:Application>
我们如何定义我们想显示的范围呢?
<esri:Map>下面添加<esri:extent>子标签,我们就可以来控制 当前的显示范围了。 <esri:extent> <esri:Extent id = “esriMapExtent” xmin=“103” ymin=“31” xmax=“103.5” ymax=“31.5”/> </esri:extent> 其中x是经度,y 是纬度。 这样一个成都地区的map 就可以显示到我们面前了。
最近学习内容
最近开始学习ArcGIS API for Flex,开始好久感觉没思 路,网上查了好多资料,才慢 慢有点收获。不过现在我的认 识还很浅,但是我一直在努力 学习中。
ArcGIS RIA开发Flex超强应用
ArcGIS RIA开发Flex超强应用arcgis-ria开发flex超强应用ARCGISRIA开发实践[Flex章节] I. ARCGISFISAPI基础Flex的历史和现状flex的前身是flash,flash是极为流行的互联网矢量动画解决方案,目前据统计97%的浏览器都安装有flashplayer插件用以播放swf动画,其中未安装的3%还有很多是因为某些场合的安全限制导致的,可以说flash是极为普及的ria平台。
然而,由于flash是一款动画软件,有许多概念对程序员来说并不容易理解,比如时间线和电影编辑,所以Macromedia推出了flex。
Flex放弃了很多动画设计术语,转而采用程序员喜欢的开发RIA应用程序的方式,Flex可以编译生成可以在flash player中运行的swf文件,这无疑吸引了大量程序员,实现了与flash平台的无缝拼接,从而利用了大量的素材,艺术家和设计师通过flash平台积累了多年。
adobe公司在2021年收购了macromedia公司,并在第一时间将flex/flash冠以adobe的商标推向市场,可见其对ria市场和flex/flash的重视。
目前,可以说adobe Flex/flash是最流行、最成熟的RIA平台。
二arcgisflexapi概述ArcGIS flex API是ArcGIS API for flex的首字母缩略词,我自己使用,并将在本文中使用。
arcgisflexapi是arcgis在ria领域的第一个产品,因此选择了最为成熟的flex/flash平台。
使用arcgisflexapi可以开发运行于浏览器中的web应用或者运行于桌面的air应用,它基于arcgisserver的rest接口,所有的功能都可以在restsdk中找到影子。
用ArcGIS Flex API开发的Flex应用程序可以方便地使用rest接口提供的地图功能和GIS查询分析功能;同时,ArcGIS flex API专注于实现GIS功能,无需重复创建组件,因此它可以轻松地将您的业务与GIS结合起来。
ArcGIS API for Flex 教程
版权声明本文档版权为ESRI中国(北京)有限公司所有。
未经本公司书面许可,任何单位和个人不得以任何形式摘抄、复制本文档的部分或全部,并以任何形式传播。
本文档版本依照以下原则进行(version x.yz):x:文档结构变化,设计框架升级y:具体内容更新,章节内容修正z:文字格式调整,奇数为包含对上一版修改记录或批注的稿子,偶数为对上一版修改稿的定稿版本修订记录版本提交日期负责人描述0.10 2008年11月13日张0.20 2008年11月14日张0.30 2008年11月17日张0.32 2008年11月19日张0.33 2008年11月20日陈0.34 2008年11月21日张0.90 2008年11月24日陈1.00 2008年11月25日王目录一初级篇 (4)1.1环境搭建 (4)1.1.1概述 (4)1.1.2相关资源 (4)1.1.3第一个ArcGIS API for Flex程序 (5)1.1.4参考资料及其他 (6)1.2地图的创建 (6)1.2.1概述 (6)1.2.2创建地图 (7)1.2.3事件(Event) (8)1.3绘制与符号化 (9)1.3.1概述 (9)1.3.2绘图控件的使用 (9)1.3.3符号化 (9)1.3.4地图的浏览 (10)1.4T ASK之Q UERY&F IND&I DENTIFY (10)1.4.1概述 (10)1.4.2在mxml文档中嵌入 ActionScript (11)1.4.3 QueryTask (11)1.4.4 FindTask (13)1.4.5 IdentifyTask (15)1.4.6 InfoWindow (17)二中级篇 (18)2.1地理定位(L OCATOR) (18)2.1.1概述 (18)2.1.2地理编码(GeoCode) (18)2.1.3逆地理编码(Reverse Geocode) (20)2.2地理处理(G EOPROCESSING) (21)2.3几何服务(G EOMETRY S ERVICE) (22)2.4打印地图(P RINT) (23)2.5G EO RSS的读取 (24)2.5.1 GeoRSS概述 (24)2.5.2 GeoRSS读取 (24)三高级篇 (26)3.1W EB S ERVICE的使用 (26)3.2ESRI T ILEMAP四叉树索引研究 (28)3.3自定义控件的开发 (31)3.4与G OOGLE M AP的融合 (32)一初级篇1.1环境搭建1.1.1概述ArcGIS API for Flex是ESRI 2008年新推出的WebGIS客户端开发包,用于富互联网应用程序RIA(Rich Internet Applications)的开发,为ArcGIS Server 9.3提供了一套全新的开发方式,其优点是运行速度快,为用户提供优秀的用户体验。
arcgis操作步骤
arcgis操作步骤
ArcGIS 是一套地理信息系统(GIS)软件,用于处理、分析和可视化地理数据。
以下是一般情况下在ArcGIS 中进行基本操作的一些步骤:
一、启动ArcGIS:打开ArcGIS 软件。
二、创建新地图文档(Map Document):在ArcGIS 中创建一个新的地图文档,用于存储地图和相关的地理数据。
三、添加数据(Add Data):将要分析或显示的地理数据添加到地图文档中。
可以是矢量数据(点、线、面)、栅格数据(影像、地形)等。
四、设置地图投影(Define Projection):确保地图文档中的各个数据集使用相同的地理投影,以确保数据在地图上正确对齐。
五、制作地图(Map Layout):在地图文档中创建地图布局,包括地图的标题、图例、比例尺等元素。
六、进行空间分析(Spatial Analysis):使用ArcGIS 工具进行空间分析,如缓冲区分析、空间查询、网络分析等。
七、制作图表和统计(Charts and Statistics):使用ArcGIS 工具制作地理图表,进行数据统计和可视化。
八、输出地图(Export Map):将制作好的地图导出为图像文件、打印文档或其他可用形式。
九、保存和分享(Save and Share):定期保存地图文档,并根据需要分享或分发地图。
十、关闭ArcGIS:完成工作后关闭ArcGIS 软件。
这只是一般情况下的一些基本步骤,具体操作可能会因任务和数据类型而有所不同。
根据具体的需求和工作流程,ArcGIS 提供了丰富的工具和功能来支持地理信息系统的各种应用。
ArcGIS For Flex 图例Toc
Flex4.5图例图层工具介绍文档ESRI中国(北京)有限公司2011年7月版权声明本文档版权为ESRI中国(北京)有限公司所有。
未经本公司书面许可,任何单位和个人不得以任何形式摘抄、复制本文档的部分或全部,并以任何形式传播。
制定及修订记录目录目录FLEX4.5图例图层工具 (1)介绍文档 (1)目录 (I)1开发环境 (1)2主要内容 (1)3详细内容 (2)3.1T OC T OOL (3)3.2T OC I TEM C LASS (4)3.3T OC E VENT (4)3.4T OC R ENDERER (4)3.5T OC C HECK B OX S KIN (4)4应用示例 (4)1开发环境1.平台:Flash Builder 4.52.SDK版本:4.5.03.ArcGIS API For Flex 2.3.14.ArcGIS Server 10.012主要内容制作拥有图例信息的图层树。
若图层为Group Layer,则图层树中对应的图层对象能够控制显示。
若图层为其他对象(如Feature Layer)则图层树中对应的图层对象显示图例图片和图例信息。
同时监听Map对象中是否有图层添加或者移除,刷仙图层树的显示。
示例如下图3详细内容工具包:Hymn.Toc.*;主要包括:TocTool.mxmlTocItemClass.asTocEvent.asTocRenderer.mxmlTocCheckBoxSkin.mxml。
3.1T ocTool图层树对象,继承自Tree。
用以绑定地图显示图层树的核心对象。
属性:1.MapItem数据类型:Map读写性质:读/写说明:绑定Map对象2.PresentItem数据类型:TocItemClass读写性质:读/写说明:当前选择的树节点数据3.PresentItem数据类型:TocItemClass读写性质:读/写说明:当前选择的树节点数据事件:yerselected事件类型:TocEvent触发条件:当每个图层节点的名称没单击后会抛出此事件yervisibled事件类型:TocEvent触发条件:当图层可见性改变后会抛出此事件3.2T ocItemClassTocTool的数据类,通过图层的图例数据生成。
基于flex和arcgis server的webgis设计与实现
基于flex和arcgis server的webgis设计与实现
要基于flex和arcgis server来设计和实现webgis,主要包括以下几个步骤:
1. 确定需求:确定webgis的基本功能和用户需求,包括地图浏览、查询、分析、可视化等。
2. 配置arcgis server:将arcgis server安装在服务器上,配置服务、数据源等。
确保服务能够正常发布和使用。
3. 开发flex应用:使用flex开发webgis应用程序,包括界面设计、地图控件、交互操作等。
4. 存储和管理数据:确定数据存储方式和数据管理方式,包括数据库、文件存储等。
确保数据的安全和可靠性。
5. 服务发布和调用:将arcgis server发布的服务通过flex应用进行调用,并进行相应的数据操作和处理。
6. 调试和测试:对webgis进行调试和测试,确保应用程序能够正常运行,并能够满足用户需求。
7. 优化和维护:定期对webgis进行优化和维护,包括性能优化、安全维护等,确保webgis的长期稳定运行。
在以上步骤中,需要注意的是,灵活运用arcgis server提供的各种功能和API,结合flex的优势,选取合适的技术和工具进
行开发和实现。
同时,保持良好的代码和文档管理,以方便后期的维护和升级。
ArcGIS For Flex 地图内嵌饼状图
override public function get graphicProvider():Object {
return super.graphicProvider(); }
3.3.2 重写 setter graphicProvider 方法
override public function set graphicProvider(value:Object):void
_showToolTip = value; }
public function get labelSymbol():Symbol {
return _labelSymbol; }
public function set labelSymbol(value:Symbol):void {
_labelSymbol = value; }
_precision = value; }
public function get fields():Array {
return _fields; }
public function set fields(value:Array):void {
_fields = value; }
public function get outerRadiusFunction():Function {
return _series; }
public function set series(value:Array):void {
value = value == null ? [] : value; _series = value;
var n:int = value.length; for (var i:int = 0; i < n; ++i) {
ARCGIS柱状图制作
1)添加数据
点击添加数据:Hale Waihona Puke 可以打开数据表查看其属性:
柱状图就是以其中的一列或者几列数据来做的。
双击数据文件RS-zhiai,弹出图层属性表,选择symbology,
上图红框中有data view和layout view选项,当柱状图做好后,切换到layout view视图:
在图上右键点击distribute-fit margins使图铺满方框:
插入图例、比例尺、指北针等,插入指北针等时大小可能不合适,需进行调整,调整时需在select elementes模式下进行放大缩小或移动。
所有底图(河流、行政区划、点等)添加完、所有文字显示完后就可以出图了,file-export map,需在layout view模式下操作。
可设置输出格式、dpi等:
最后出图如下:
如何利用ArcGIS制作图表 线图 柱图等
图表—ArcGIS一直被忽略的功能在ArcGIS应用中,图表功能一直被相当一部分同行被忽视,甚至有些同行是通过Excel分析生成后,再加载到GIS界面中。
其实可以在ArcGIS for Desktop 应用程序中创建图表以对数据进行可视化和发掘。
ArcGIS图表类型包括以下几种:图表类型示例描述条形图条形图包含两个或多个平行的矩形,每个矩形都表示一个特定的属性值。
这些图表用于比较数量或显示趋势 - 例如,每月降雨量。
条的方向可以为垂直或水平。
直方图 直方图是垂直条形图的子类型,可显示多个值的频率分布。
条最小值和最大值图 条最小值和最大值图可高亮显示一系列数据的最小值和最大值。
线 折线图由一条或多条连接连续属性值的线组成。
可沿线为值绘制符号。
折线图显示沿连续标度的多个值的趋势。
线的方向可以为水平或垂直。
面积 面积图在连续属性值之间绘制一条直线,并填充该直线和轴之间的区域。
与折线图一样,面积图也显示值的趋势,但阴影更能强调数量的差异。
面积图的方向可以为水平或垂直。
散点图 散点图使用属性值作为 x,y 坐标来绘制点。
图案可显示绘制在格网上的值之间的关系。
箱图箱图是显示多个值的统计分布的有效方式。
箱体指示中间50% 数据的分布方式,从箱延伸出的线是分布范围之外的值乘以某个系数的范围,并且任何点都是异常值。
箱图也称为箱须图。
泡状图气泡图允许以二维方式绘制三个变量。
它是散点图的一种变化形式,其中气泡大小表示特定数据值。
例如,气泡的大小可表示总人口,沿 y 轴位置表示出生率,沿 x 轴位置表示死亡率。
极坐标 极线图允许在圆形格网上根据角度或方向绘制变量。
极线图主要用在数学和统计学应用方面。
例如,可以绘制不同 x,y 位置的风向。
饼图 饼图由一个被分割成两个或更多扇区(切片或楔形)的圆(“饼”)组成。
饼图显示了部分和整体之间的关系,对于显示比例和比率特别有用。
可通过“拆分”某个饼图切片(将其从中心略微向外分离)来高亮显示该饼图切片。
ArcGIS API for Flex 调用天地图、e都市瓦片地图等第三方瓦片方法
ArcGIS API for Flex 调用天地图、e都市瓦片地图等第三方瓦片众所周知,像天地图和e都市的地图都是以切片的形式存放在服务端的,系统根据用户选择的范围加载该范围的瓦片地图,这比传统的实时渲染地图的响应速度更快。
google地图和baidu地图的原理也不外乎如此。
所以说,如果本地硬盘上有瓦片地图,或者我们知道瓦片地图在远程服务器端的组织形式,利用简单的javascript脚本语言和浏览器就可以实现对地图的浏览,通俗地说,这其实就是一个图片浏览器。
考虑到远程服务器需要网络连接,最近利用闲暇时间将长沙市范围的e都市上的瓦片下载到本地,这样在没有网络的情况下也能浏览地图了。
采用网上广泛流传的完全利用js脚本写的开源“webgis完整功能例子”,换上本地硬盘上下载好的长沙范围内e都市地图,效果图如下。
当然,以上是网络上js高手写的API,功能不是很强大,但是至少为我等开发者提供了值得借鉴的思路。
esri也提供了可以浏览瓦片地图的API,包括javascript API,silverlight API和flex API,作为客户端语言,这三者提供的功能大致相似,甚至在类的命名上都保持了高度的一致性。
利用arcgis api for javascript同样可以将下载到本地的瓦片和远程服务器端的瓦片进行地图浏览,本人结合最近做的利用ArcGIS API for Flex(以下简称ags4fx)加载天地图的瓦片地图来说明该过程,javascript api和silverlight api可以参考该方法加载瓦片地图。
根据最新的ags4fx 2.4可知,esri为我们提供了TiledMapServiceLayer类,这个类正是所有瓦片地图服务都必须继承的类,像ArcGISTiledMapServiceLayer, OpenStreetMapLayer, VETiledLayer等esri提供的瓦片类都是继承了该类的,所以我们要扩展该TiledMapServiceLayer类,名字暂且叫TianDiTuTiledMapServiceLayer。
arcgis柱状及趋势分析
arcgis柱状及趋势分析
1、趋势分析前提
趋势分析的前提是要有NDVI年均值图像,可以直接通过arcmap 处理得到,过程简单,不再赘述。
步骤:ArcToolBox——>Spatial Analyst Tools——>Local——>Cell Statistics
该像元统计工具还可以做最大值合成,其本质都是对两景或两景以上影像求均值。
实际上还是要根据自己的需求进行前期处理。
2、趋势分析
工具:栅格计算器
位置:ArcToolBox——>Spatial Analyst Tools——>Map Algebra ——>Raster Calculator
步骤:
(1)加载年均值图像。
我的是2016-2020五年时间,所以公式中n取5。
(2)打开栅格计算器,输入趋势分析公式。
由于公式累加较长,故先计算分子左边:
(3)重分类,划分等级,出趋势分析图。
重分类工具位置:ArcToolBox——>Spatial Analyst Tools—
—>Reclass——>Reclassify
(注意:数据管理工具——>栅格——>栅格处理中也有一个重分类工具,不要用这个)。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
<mx:PieSeries field="num" labelField="name" labelPosition="inside">
<mx:fills>
<mx:Array>
<mx:GradientEntry color="#00ff00" ratio="0"/>
</mx:Array>
</mx:PieSeries>
</mx:series>
</mx:rt>
</mx:VBox>
</mx:Component>
</mx:entries>
</mx:RadialGradient>
</mx:Array>
</mx:fills>
<mx:Array>
<mx:RadialGradient>
<mx:entries>
<mx:Array>
</mx:RadialGradient>
<mx:RadialGradient>
<mx:entries>
ARCGIS SERVER FROM FLEX 实现饼状图或者柱状图
<esri:InfoSymbol id="PointSym" infoPlacement="center" containerStyleName="InfoSymbol">
<esri:infoRenderer>
<mx:GradientEntry color="#FF0000" ratio="0"/>
</mx:Array>
</mx:entries>
</esri:infoRenderer>
</esri:InfoSymbol>
注:chart里面的{data}就是渲染的graphic的attribute
<mx:Component>
<mx:VBox width="100%" height="100%" backgroundAlpha="0">
<mx:PieChart id="pieChart" dataProvider="{data}" width="90" height="90" showDataTips="true">