config.xml文件的配置例如以下:

1
2
<widget
left=
"3" bottom="3"
config="widgets/Coordinate/CoordinateWidget.xml" url="widgets/Coordinate/CoordinateWidget.swf" />

源码文件夹例如以下:

地图坐标系模块的源码原理解析,具体的代码在下载的开源flexviewer自带的:

(1)CoordinateWidget.xml

1 <?

xml version="1.0" ?>
2 <configuration label="Coordinates (default)">
3 <!-- geo, dms, mercator 主要是坐标输出单位。默认的是经纬度 -->
4 <outputunit>geo</outputunit>
5 </configuration>

(2)CoordinateWidget.mxml

  1 <?xml version="1.0" encoding="utf-8"?>
19 <viewer:BaseWidget xmlns:fx="http://ns.adobe.com/mxml/2009"
20 xmlns:s="library://ns.adobe.com/flex/spark"
21 xmlns:mx="library://ns.adobe.com/flex/mx"
22 xmlns:viewer="com.esri.viewer.*"
23 layout="horizontal"
24 widgetConfigLoaded="basewidget_widgetConfigLoadedHandler(event)">
25 <fx:Script>
26 <![CDATA[
27 import com.esri.ags.events.MapEvent;
28 import com.esri.ags.geometry.MapPoint;
29 import com.esri.ags.utils.WebMercatorUtil;
30
31 import mx.formatters.NumberBaseRoundType;
32 import mx.utils.StringUtil;
33
34 private var m_template:String;
35 private var m_func:Function = substitute;
36
37 protected function basewidget_widgetConfigLoadedHandler(event:Event):void
38 {
39 if (configXML)
40 {
//以下是读取CoordinateWidget.xml配置文件的资源。要是配置了的话
41 const decimalSeparator:String = configXML.numberformatter.@decimalseparator;
42 numberFormatter.decimalSeparatorTo = decimalSeparator ? decimalSeparator : ".";
43 const thousandsSeparator:String = configXML.numberformatter.@thousandsseparator;
44 numberFormatter.thousandsSeparatorTo = thousandsSeparator ? thousandsSeparator : ",";
45 numberFormatter.useThousandsSeparator = configXML.numberformatter.@usethousandsseparator == "true";
46 numberFormatter.precision = parseFloat(configXML.numberformatter.@precision || "-1");
47 const rounding:String = configXML.numberformatter.@rounding;
48 numberFormatter.rounding = rounding ? rounding : NumberBaseRoundType.NONE;
49 //获取设置坐标显示的字体和颜色样式等
50 const color:String = configXML.labelstyle.@color[0] || configXML.label.@color[0];
51 coords.setStyle("color", toNumber(color ? color : "0x000000"));
52 const fontFamily:String = configXML.labelstyle.@fontfamily[0] || configXML.label.@fontfamily[0];
53 coords.setStyle("fontFamily", fontFamily ? fontFamily : "Verdana");
54 const fontSize:String = configXML.labelstyle.@fontsize[0] || configXML.label.@fontsize[0];
55 coords.setStyle("fontSize", parseInt(fontSize ? fontSize : "9"));
56 const fontWeight:String = configXML.labelstyle.@fontweight[0] || configXML.label.@fontweight[0];
57 coords.setStyle("fontWeight", fontWeight ? fontWeight : "bold");
58
59 // If no template specified, show them with a space in between (except for special case below)
60 m_template = configXML.labels.template[0] || configXML.label.@template[0] || "{0} {1}";
61
62 if (map.loaded)
63 {
64 map_loadHandler(null);
65 }
66 else
67 {
68 map.addEventListener(MapEvent.LOAD, map_loadHandler);//载入地图
69 }
70 }
71
72 function map_loadHandler(event:MapEvent):void
73 {
74 map.removeEventListener(MapEvent.LOAD, map_loadHandler);
75 const wkid:int = map.spatialReference.wkid; //获取地图的空间坐标參考系
76 m_func = substitute;
77 const outputUnit:String = configXML.outputunit;//获取地图的坐标显示单位,从配置文件获取
78 if (outputUnit === "mercator")//推断地图的坐标体系。墨卡托情况下运行
79 {
80 if (wkid === 4326 || wkid === 4269 || wkid === 4267)
81 {
82 m_func = geographicToMercator;//调用地理坐标系转换墨卡托坐标系
83 }
84 }
85 else if (outputUnit === "geo")//地理坐标系情况下运行
86 {
87 if (wkid === 102100 || wkid === 102113 || wkid === 3857)
88 {
89 m_func = mercatorToGeographic;//调用墨卡托坐标系转换地理坐标系
90 // special default for geographic outputs
91 m_template = configXML.labels.template[0] || configXML.label.@template[0] || getDefaultString("latitudeLabel") + ":{1} " + getDefaultString("longitudeLabel") + ":{0}";//设置坐标显示的文字,比方经度,纬度
92 numberFormatter.precision = parseFloat(configXML.numberformatter.@precision || "6");//设置坐标显示的位数
93 }
94 else if (wkid === 4326 || wkid === 4269 || wkid === 4267)
95 {
96 // special default for geographic outputs
97 m_template = configXML.labels.template[0] || configXML.label.@template[0] || getDefaultString("latitudeLabel") + ":{1} " + getDefaultString("longitudeLabel") + ":{0}";
98 numberFormatter.precision = parseFloat(configXML.numberformatter.@precision || "6");
99 }
100 }
101 else if (outputUnit === "dms")//经纬度显示单位为度分秒形式情况下运行
102 {
103 if (wkid === 102100 || wkid === 102113 || wkid === 3857)
104 {
105 m_func = mercatorToDMS;
106 }
107 else if (wkid === 4326 || wkid === 4269 || wkid === 4267)
108 {
109 m_func = geographicToDMS;
110 }
111 }
112 map.addEventListener(MouseEvent.MOUSE_MOVE, map_mouseMoveHandler);//监听地图鼠标移动事件,用来获取地图经纬度的
113 }
114 }
115
116 private function toNumber(value:String):int//转换单位计算
117 {
118 if (value.substr(0, 2) == "0x")
119 {
120 return parseInt(value, 16);
121 }
122 return parseInt(value, 10);
123 }
124
125 private function mercatorToGeographic(web:MapPoint):String//墨卡托转换地理坐标系的函数
126 {
127 const geo:MapPoint = WebMercatorUtil.webMercatorToGeographic(web) as MapPoint;//arcgis api封装好的转换函数
128 return StringUtil.substitute(m_template,
129 numberFormatter.format(geo.x),
130 numberFormatter.format(geo.y));
131 }
132
133 private function mercatorToDMS(web:MapPoint):String//墨卡托转换经纬度度分秒形式的函数
134 {
135 const geo:MapPoint = WebMercatorUtil.webMercatorToGeographic(web) as MapPoint;
136 return StringUtil.substitute(m_template, DegToDMS.format(geo.x, DegToDMS.LON), DegToDMS.format(geo.y, DegToDMS.LAT));
137 }
138
139 private function geographicToMercator(geo:MapPoint):String//地理坐标系转换墨卡托的函数
140 {
141 const web:MapPoint = WebMercatorUtil.geographicToWebMercator(geo) as MapPoint;
142 return StringUtil.substitute(m_template,
143 numberFormatter.format(web.x),
144 numberFormatter.format(web.y));
145 }
146
147 private function substitute(mapPoint:MapPoint):String
148 {
149 return StringUtil.substitute(m_template,
150 numberFormatter.format(mapPoint.x),
151 numberFormatter.format(mapPoint.y));
152 }
153
154 private function geographicToDMS(mapPoint:MapPoint):String
155 {
156 const x:String = DegToDMS.format(mapPoint.x, DegToDMS.LON);
157 const y:String = DegToDMS.format(mapPoint.y, DegToDMS.LAT);
158 return StringUtil.substitute(m_template, x, y);
159 }
160
161 private function map_mouseMoveHandler(event:MouseEvent):void
162 {
163 const mapPoint:MapPoint = map.toMapFromStage(event.stageX, event.stageY);//获取鼠标移动的地图经纬度
164 coords.text = m_func(mapPoint);
165 }
166 ]]>
167 </fx:Script>
168
169 <fx:Declarations>
170 <mx:NumberFormatter id="numberFormatter"/>
171 </fx:Declarations>
172 <viewer:filters>
173 <mx:GlowFilter alpha="1"
174 blurX="3"
175 blurY="3"
176 color="0xFFFFFF"
177 strength="7"/>
178 </viewer:filters>
179 <s:Label id="coords" color="0x000000"/>//显示经纬度的位置。显示label
180 </viewer:BaseWidget>

(3)DegToDMS.as

 1 package widgets.Coordinate
2 {
3
4 /**
5 * Utility class to pretty print decimal degree numbers.
6 * @private
7 */
8 public final class DegToDMS
9 {
10 // Constants to define the format.
11 public static const LAT:String = "lat";
12
13 public static const LON:String = "lon";
14
15 /**
16 * Utility function to format a decimal degree number into a pretty string with degrees, minutes and seconds.
17 * @param decDeg the decimal degree number.
18 * @param decDir "lat" for a latitude number, "lon" for a longitude value.
19 * @return A pretty print string with degrees, minutes and seconds.
20 */
21 public static function format(decDeg:Number, decDir:String):String//这个函数主要是用来把经纬度转换度分秒的形式来展示经纬度,比方113度23分23秒等等
22 {
23 var d:Number = Math.abs(decDeg);
24 var deg:Number = Math.floor(d);
25 d = d - deg;
26 var min:Number = Math.floor(d * 60);
27 var av:Number = d - min / 60;
28 var sec:Number = Math.floor(av * 60 * 60);
29 if (sec == 60)
30 {
31 min++;
32 sec = 0;
33 }
34 if (min == 60)
35 {
36 deg++;
37 min = 0;
38 }
39 var smin:String = min < 10 ? "0" + min + "' " : min + "' ";
40 var ssec:String = sec < 10 ? "0" + sec + "\" " : sec + "\" ";
41 var sdir:String = (decDir == LAT) ? (decDeg < 0 ? "S" : "N") : (decDeg < 0 ? "W" : "E");
42 return deg + "\xB0 " + smin + ssec + sdir;
43 }
44 }
45
46 }

备注:

GIS作品:百度搜索:GIS之家(https://shop116521643.taobao.com/shop/view_shop.htm);

QQ兴趣部落GIS技术交流:gis之家(http://buluo.qq.com/p/barindex.html?bid=327395);

GIS毕业设计&项目承接群:238339408;

GIS技术交流群:432512093

天津政府应急系统之GIS一张图(arcgis api for flex)解说(三)显示地图坐标系模块的更多相关文章

  1. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(一)GIS一张图的系统开发环境以及flexviewer框架

    系统的GIS功能实现是基于arcgis api for flex,首先附上系统的主界面图,接下来的是对主界面的模块功能详细讲解: 一.GIS环境软件安装 (1)arcgis desktop的安装,要是 ...

  2. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十)态势标绘模块

    config.xml文件的配置如下: <widget label="态势标绘" icon="assets/images/impact_area_over.png&q ...

  3. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(三)显示地图坐标系模块

    config.xml文件的配置如下: <widget left="3" bottom="3" config="widgets/Coordinat ...

  4. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(八)资源搜索模块

    config.xml文件的配置如下: <widget label="资源搜索" icon="assets/images/public_impact_over.png ...

  5. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(二)鹰眼模块

    讲解GIS功能模块实现之前,先大概说一下flexviewer的核心配置文件config.xml,系统额GIS功能widget菜单布局.系统的样式.地图资源等等都是在这里配置的,这里对flexviewe ...

  6. 天津政府应急系统之GIS一张图(arcgis api for flex)解说(二)鹰眼模块

    解说GIS功能模块实现之前,先大概说一下flexviewer的核心配置文件config.xml,系统额GIS功能widget菜单布局.系统的样式.地图资源等等都是在这里配置的,这里对flexviewe ...

  7. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十三)台风模块

    config.xml文件的配置如下: <widget label="台风" icon="assets/images/typhoon.png" config ...

  8. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十一)路径导航模块

    config.xml文件的配置如下: <widget label="路径导航" icon="assets/images/lujingdaohang.png" ...

  9. 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(六)地图搜索模块

    config.xml文件的配置如下: <widget label="地图搜索" icon="assets/images/emergency_resource_ove ...

随机推荐

  1. Javascript数组求和的方法总结 以及由斐波那契数列得到的启发

    一次面试中,面试官要求用三种不同的Javascript方法进行一个数字数组的求和,当时思来想去只想到了使用循环这一种笨方法,因此面试比较失败,在这里总结了六种Javascript进行数组求和的方法,以 ...

  2. C#基本功之委托和事件

    定义:委托是一种引用类型,表示对具有特定参数列表和返回类型的方法的引用. 在实例化委托时,你可以将其实例与任何具有兼容签名和返回类型的方法相关联 目的:方法声明和方法实现的分离,使得程序更容易扩展 一 ...

  3. Python 列表浅拷贝与深拷贝

    浅拷贝 shallow copy 和深拷贝 deep copy list.copy() 浅拷贝:复制此列表(只复制一层,不会复制深层对象) 等同于 L[:] 举例: 浅拷贝: a = [1.1, 2. ...

  4. 运维必须掌握的150个Linux命令

    线上查询及帮助命令(1个)man 目录操作命令(6个)ls tree pwd mkdir rmdir cd 文件操作命令(7个)touch cp mv rm ln find rename 文件查看及处 ...

  5. 2017年当下最值得你关注的前端开发框架,不知道你就OUT了!

    近几年随着 jQuery.Ext 以及 CSS3 的发展,以 Bootstrap 为代表的前端开发框架如雨后春笋般挤入视野,可谓应接不暇. 在这篇分享中,我将总结2017年当下最值得你关注的前端开发框 ...

  6. SSD中的GC机制以及Trim

    GC(Garbagecollection)垃圾回收  所谓GC就是把一个闪存块里的"有效"页数据复制到一个"空白"块里,然后把这个块完全擦除.GC是 SSD里的 ...

  7. linux 运维常用工具表

    https://code.google.com/p/httperf/  ※测量Web服务器的性能 ./configure   make &&make install http://ww ...

  8. JavaScript数据可视化编程学习(二)Flotr2,雷达图

    一.雷达图 使用雷达图显示多维数据. 如果你有多维的数据要展示,那么雷达图就是一种非常有效的可视化方法. 由于雷达图不常用,比较陌生,所以向用户解释的时候有一些难度.注意使用雷达图会增加用户认知负担. ...

  9. python中print()函数的“,”与java中System.out.print()函数中的“+”

    python中的print()函数和java中的System.out.print()函数都有着打印字符串的功能. python中: print("hello,world!") 输出 ...

  10. Vue使用Echarts以及Echarts配置分享

    一.本篇文章将给大家分享如何在vue中使用echart以及echart各项配置,这些配置都是工作中比较常见以及常用到的,所以给大家分享下,希望对大家有用. 二.vue中使用echart. 1.首先下载 ...