主界面基本模块
(1 )平移:单击按钮将鼠标置于平移状态,可用来清除当前图形操作工具的状态。
(2 )放大: 单击按钮对地图进行放大操作(或者通过鼠标中键进行)。
(3 )缩小: 单击按钮对地图进行缩小操作(或者通过鼠标中键进行)。
(4 )全图: 单击按钮显示全图。
(5 )保存: 单击按钮将发生改变的地图数据更新到数据库。
(6 )删除: 单击按钮删除地图要素。
(7 )添加:添加绘制新的道路。
(8 )属性: 单击查看道路段属性信息。
(9 )剪切: 选择剪切道路。
(10 )联合: 联合不同的道路。
(11 )撤销:撤销之前的操作。
(12 )恢复:恢复之前的操作。
导人ArcGIS 相关库文件以及功能的关键实现代码如下:
require( [ ” esri/urlUtils”, ” esri/map”, ” esri/tasks/GeometryService” , ” esri/toolbars/edit” , ” esri/layers/ArcGISTiledMapServiceLayer”, ” esr i/ layers/FeatureLayer", ” esri/graphic”, ” esri/tasks/RouteTask”, ” esri/tasks/RouteParameters” , ” esri/tasks/FeatureSet”, dojo/on”, ” di] it/registry”, ” esri/geometry/Extent”, 飞sri/layers/ArcGISDynamicMapServiceLayer ”, ” esri/symbols/PictureMarkerSymbol”, ” dojo/_base/array”, ” dojo/dom”, ” esri/Color”, ” esri/symbols/SimpleMarkerSymbol”, 飞sri/symbols/SimpleLineSymbol ”, ” esri/dijit/editing/Editor", ” esri/dijit/HomeButton”, ” esri/dijit/Measurement”, ” esri/dijit/Directions”, ” esri/dijit/editing/TemplatePicker”, ” esri/config”, ” dojo/i18n!esri/nls/jsapi”, ” dojo/_base/array”,”dojo/parser”,”dojo/keys”, ” dijit/layout/BorderContainer”,”dijit/layout/ContentPane”, ” dijit/TitlePane”, ” dijit/form/CheckBox”, ” di〕it/form/H口rizontalSlider", ” dijit/form/HorizontalRuleLabels”, ” dojo/domReady1 ” ] , function ( urlUtils, Map, GeometryService, Edit, ArcGISTiledMapServiceLayer, FeatureLayer, Graphic,RouteTask, RouteParameters,FeatureSet,on, registry,Extent,ArcGISDynamicMapServiceLayer, PictureMarkerSymbol,array,dom, Color, SimpleMarkerSymbol, SimpleLineSymbol, Editor, HomeButton,Measurement,Directions,TemplatePicker, esriConfig, jsapiBundle, arrayUtils, parser, keys ){ parser. parse(); //代理设置 //use a proxy to access the routing service, which requires credits / 替urlUtils.addProxyRule({ urlPref ix ” route.arcgis.com”, proxyUrl ”/sproxy/
地图基本管理模块
基本GIS 图形操作功能包括多图层显示、放大、缩小、全图显示、鹰眼导航和图层控制
功能,1 .初始化
地图初始化关键代码如下:
map = new Map (”map ”,{ center: [ 120. 179787 , 30 . 263478], 图8. 4-1 图形操作用例图 zoom : 16, slider ;”small”, logo: false, navigationMode :’classic ’, Extent ( {xmin: - 20098296, ymin: - 2804413, xmax: 5920428, ym皿: 15813776, spatia1Reference:{wkid:S4032}}) var basemap = new esri. layers. ArcGISTiledMapServiceLayer (” http://cachel. 缸cgisonline.cn/ArcGIS/rest/services/ China1归lineCommunity/MapServer”); map.addLayer(bas 四ap); map.on (勺ayers - add - result”, initEditor);
- 地图浏览
地图浏览包括地图放大、缩小、图层控制、鹰眼导航、全图显示、经纬度显示,关键代码如下:
//地图初始化 function initEditor( evt) { map . disableDouble ClickZoom(); //模版选择器 var templateLayers = arrayUtils. map( evt. layers, function (result) { return result. layer; ., ) } var templatePicker = new TemplatePicker( { featureLayers: templateLayers, grouping: true, rows. ” auto", columns : 2 },”templateDiv ”); templatePicker. startup(); V缸layers = arrayUtils. map( evt. layers, function (result) { return { featureLayer: result. layer } ; , ) } var settings = { map : map, templatePicker: templatePicker, layerlnfos: layers, toolbarVisible: true, enableUndoRedo: true, createOptions : { polylineDrawTools : [ Editor. CREA四_TOOL_FREEl诅ND_POLYLI阻], polygonDra旷reals: [ Editor . CREATE_τ。OL_FREEHAND_POLYGON, Editor.CREATE TOOL CIRCLE, Editor.CREATE_TOOL_TRIANGLE, Editor . CREAτ'E TOOL RECTANGLE }, toolbarOptions : { cutVisible: true, mergeVisible : true, reshapeVisible : true layer Info: { showGlobalID : true, showObjectID: true, var params = (settings: settings} ; V缸myEditor = new Editor(p缸ams ,’ editorDiv'}; I I define snapping options var symbol = new SimpleMarkerSymbol ( SimpleMarkerSymbol. STYLE_ CROSS, 15, new SimpleLineSymbol( SimpleLineSymbol. STYLE_ SOLID, newColor([255, 0, 0, 0 . 5]), 5 null map. enableSnapping(( snapPointSymbol: symbol, tolerance : 20, snapKey : keys . ALT } ) ., myEditor. startup();
地图属性
属性查看功能用于查看具体的道路属性信息,道路属性窗口界面
手机定位模块
手机定位APP 的用例图如图
所示,主要功能包括地图浏览、地点搜索、路径查询、手机定位、路径导航。
主界面大纲视图
打开工程文件,依次展开文件夹目录res /layout ,在l ayout 文件夹上有击,新建一个xm l 文件,命名为m a in. xml 。界面的大纲视图如图所示。
通过图形布局视图可以看到界面的效果如
所示,左上角设置了一个定位按钮,旁边设置了一个标签控件用于显示位置的经纬度信息,界面底部是导航条,由3 个按钮控件组成,导航条上方是地图的放大和缩小按钮,布局中的空内区域用于加载电子地图Map Vi ew 控件。用同样的方式来设计其他二级界面.
空白区域为地图加载区。需要注意的是,起始点输入框在运行的时候会以Dialog 对话框的形式加载而不是以Activity 的形式加载。
在src 文件夹下的包com. esri. arcgis. android. samples.helloworld 中新建一个J ava 源文件,命名为Ma i nActivi ty.iava ,作为程序的主界面,需要实现如下功能: 地图加载,实现定位,通过菜单切换不同类型的地图,通过按钮控件启动二级界面等。要实现选项菜单切换不同类型的地图,需要在类的属性中声明地图切换选项,代码如下:
//菜单的地图切换选项 MenuitemmStreetsMenuitem = null ; MenuitemmTopoMenuitem = null; MenuitemmGrayMenultem = null; MenuitemmOceansMenultem = null ; MenuitemmHybridMenultem = null; MenultemmNationalMenuitem = null; MenuitemmOsmMenuitem = null; MenuitemmSattliteitem = null; //为每种地阁选项创建地图类型 finalMapOptionsmTopoBasemap = newMapOpt ions ( MapType. TOPO); finalMa向tionsmStreetsBasemap = newMapOptions ( Map'fype. STREETS); finalMapOptionsmGrayBasemap = newMapOptions(MapType. GRAY); finalMapOptionsmOceansBasemap = newMapOptions(MapType. OCEANS); finalMapOptionsmHybridBasemap = newMapOptions(MapType. HYBRID); finalMapOptionsmNationalBasemap = newMapOptions( MapType.NATIONAL_GE伺RAPHIC); finalMapOptionsmOsmBasemap = newMapOptions(MapType. OSM); finalMapOptionsmSattliteBasemap = newMapOptions(MapType. SATELLITE);
实现创建选项菜单
实现创建选项菜单的方法onCrea teOptionsMenu ,代码如下:
public booleanonCreateOptionsMen叫Menu阴阳){ getMenuinflater(). inflate(R. menu. basemap_menu,menu); mStreetsMenuitem = menu. getitem( 0); mTopoMenuitem = menu. getit四( 1) i mGrayMenuitem = menu. getitem(2); mOceansMenuitem = menu. getitem(3); mHybr idMenuI tern = menu. get Item ( 4) ; mNationalMenuitem = m四u . getit四( 5); mOsmMenuitem = menu. getrtem(6); mSattliteitem = menu. getitem(7); mTopoMenuitem.setChecked(true); return true;
添加点击事件
为选项菜单的菜单项添加点击事件,这样可以实现用菜单来切换地图类型的功能。具体代码如下:
p由lie booleanonOptionsitemSelected( Mem山emitem) { mCurrentMapExtent = mMapView. getExtent(); //处理菜单选中的事件 switch (item. getitemid()) { case R. id. 四orld_Street_Map: mMapView. setMapOptions(mStreetsBasemap); mStreetsMenuitem.setChecked(true); return true; case R. id. World_Topo: mMapView. setl:lapOptions(mTopoBasemap); mTopoMenuitem. setChecked(true); return true; case R. id. Gray: mMapView.setMapOptions(mGrayBasemap); mGrayMenuitem. setChecked(true); return true; case R. id. Ocean_Basemap: mMapView. setMapOptions(mOceansBasemap); mOceansMenuitem.setChecked(true); return true; case R. id. Hybrid: mMapView. setMapOptions(mHybridBaserr呻); mHybridMenultem. setChecked{true); return true; case R. id. Osm : mMapView. setMapOptions(mOsmBasemap); mOsmMenultem.setChecked(true); return true; case R. id. National : mMapView.setMapOptions{mNationalBasemap); mNationalMenultem. setChecked(true); return true; case R. id. Satellite : mMapView. setMapOptions(rr臼ttliteBasemap); mSattliteltem. setChecked(true); return true; default : return super. onOptionsltemSelected( item);
<uses - permissionandroid: name =”android. permission. INTERNET”/> <uses - permissionandroid : name =” android.permission.WR!咀-阻TERNAL_STORAGE”/〉 <uses - permissionandroid: name = ” android.permission.ACCESS_FINE_LOCATION”/>
实现加载底图图层和定位图层
在该类文件中添加如下代码,实现加载底图图层和定位图层,通过实例化
LocationDisplayManager 这个类来调用该类的GPS 定位功能。 MapViewmMapView; GraphicsLayergLayerGps; Locationloc; public void onCreate{BundlesavedlnstanceState) { super.onCreate(savedlnstanceState); setContentView(R.layout. main); mMapView = {MapView) findViewByld(R . id. map); gLayerGps = newGraphicsLayer(); mMapView.addLayer(gLayerGps); f i nalLocationDisplayManagerlocdisplayMag; locdisplayMag = mMapView. getLocationDisplayManager(); locdisplayMag. setLocationListener{newLocationListener() { @Override public void onStatusChanged( String provider, intstatt冉 Bundleextras) {
@Override public void onProviderEnabled(String provider) { Toast . makeText(getApplicationContext (),” GPS 己启用. ”, Toast.LENG四_ SHORT) . show(); @Override public void onProviderDisabled(String provider) { Toast.makeText(getApplicationContext (),” GPS 未启用, 请开启”, Toast . LENGTH _SHORT) . show(); @Override public void onLocationChanged( Locationl) { if (1 != null) { PointptLatLon = newPoint( 1. getLongitude (), 1 . getLatitude()); Spatia1Referencesr4326 = SpatialRefer enc e . create ( 4326), PointptMap = (Point) GeometryEngi ne . pr oject( ptLatLon, sr4326,耐apView.getSpatialReferenc e()); 时也pView . centerAt(ptMap, true); t飞rloc . setText (”Lon :”+ 1. getLongi t ude() + ”, Lat” + 1. getLatitude()); //启动定位服务 locdisplayMag. start();
完善这个类文件
实现了定位功能之后,还需要进一步完善这个类文件,由于是程序的主类, 因此我们需要添加调用其他二级界面的人口和功能,主界面布局文件ma in. xml 中已经添加了3 个调用按钮,因此在MainActivity. java 文件中,需要通过控件id 找到按钮, 然后绑定相应的事件。需要注意的是, Activity 之间的调用使用的是Int e nt 这样一个消息传递类, 具体代码如下:
private Buttonbtnearby =口ull; private Buttonbtrouter = null; private Buttonbtnavigation = null; btnearby = (Button) findViewByid(R. id. btnear); btrouter = (Button) findViewByid(R. id. btrouter) ; btnavigation = (Button) findViewByid(R. id. btnavigation); //为搜索按钮设置按钮监昕器 btnearby. setOnClickListener(newOnClickListener() { @Override public void onClick(Vi ewv) { Intentintent = newintent(); intent. setClassName(getApplicationContext(), ” com. esri. arcgis . android. samples . helloworld. PlaceSea r chActivity”), startActivity(intent); }); // 为路径按钮设置按钮监听器 btrouter. setOnClickListener(newOnClickListener() { @Override public void onClick(Viewv) { Intentintent = newintent(); intent.setClassName(getApplicationContext(), ”com.esri.arcgis . android. s四ples.routing.RoutingActivity”); startActivity(intent ); }), //为导航按钮设置监听事件 btnavigation.setOnClickListener(newOnClickListener() { @Override public void onClick(Viewv) { Intentintent = newintent(); intent. setClassName(getApplicationContext(), ”com.esri. arcgis.android.samples.routing.RoutingActivity”); startActivity(intent);