ArcGIS API for Flex 使用ArcGIS API for Flex 创建一个新的地图项目

参考官方: https://developers.arcgis.com/flex/guide/getting-started.htm  https://developers.arcgis.com/flex/guide/tutorial-adding-a-map-with-layers.htm

新建Flex工程

  1. 下载并解压缩ArcGIS API Flex ZIP文件这个文件包含Flex的ArcGIS API libs库(.swc)、语言环境、皮肤包文件
  2. 在 Flash Builder中,选择 File > New > Flex Project.
  3. 在 New Flex Project 对话框中,输入一个项目名称,例如. 'MyFirstApp'.
  4. 是否选定项目认工作空间位置
  5. 应用程序类型选择Web类型
  6. 选择SDK版本
  7. 下一步



       这里我们可以先不用选择应用服务类型,然后选择下一步


       下列选项设置认即可,点击Finish完成

添加Flex API库

 Package Explorer 视图中选中项目,右键单击Properties,左边选择Flex Build Path.  然后点击 Library Path选项卡, 点击Add SWC 按钮



好了,现在可以编写自己的ArcGIS程序代码了,假设我们已经创建了被引用的API库的空白项目

在应用程序中显示地理信息的主要方式是通过一个地图。 Flex的API提供了一个用户界面(UI)地图组件。该组件允许您通过任何与层参考各种网络服务,如ArcGIS Server的地图和影像服务,开放街道地图,Bing地图,OGC WMS等工作,或者从ArcGIS Online中(Esri的云),或引用预配置的Web地图显示内容你自己的内部部署ArcGIS的门户网站。

Flex应用程序使用MXML和ActionScript语言与ActionScript类库开发。 MXML可与HTML相比,它使用标签进行布局的页面。而ActionScript可以和比较Javascript学习,因为这是代码和逻辑通常是相通的。

下面我们将在MXML中加入了地图的UI组件入手学习

添加ESRI namespace命名空间引用


Editor view视图中,修改 MXML 文件

<?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" minWidth="955" minHeight="600"
   <strong>xmlns:esri="http://www.esri.com/2008/ags"</strong>>
</s:Application>

新增地图和数据​​到UI


地图是由各个图层叠加合成的效果,如上图

<?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:esri="http://www.esri.com/2008/ags"
			   minWidth="955" minHeight="600">
	
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	<esri:Map level="3" wrapAround180="true">
		<esri:center>
			<esri:WebMercatorMapPoint lat="0" lon="0"/>
		</esri:center>
		<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/>
		<esri:ArcGISDynamicMapServiceLayer alpha=".70" url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer"/>
	</esri:Map>
</s:Application>

esri:map组件中 level设置了地图显示级别为3,180度视角,设置中心,经纬度,添加地图服务层等信息

运行效果

相关文章

一:display:flex布局display:flex是一种布局方式。它即可以...
1. flex设置元素垂直居中对齐在之前的一篇文章中记载过如何...
移动端开发知识点pc端软件和移动端apppc端软件是什么,有哪些...
最近挺忙的,准备考试,还有其他的事,没时间研究东西,快周...
display:flex;把容器设置为弹性盒模型(设置为弹性盒模型之后...
我在网页上运行了一个Flex应用程序,我想使用Command←组合键...