fusionMap和amMap比较

来源：互联网发布：新电脑软件安装编辑：程序博客网时间：2024/05/16 09:11

fusionMap和amMap都是使用flash实现地理数据的显示，功能类似，有一些细微的差别，如下：

FusionMap特征：

1）使用xml进行交互，这点和fusionChart区别不大

2）可以实现resize

3）支持tooltip, legend link range（区域选择）

4）地图省名可以修改

5）支持添加marker，就是自定义图标

Ammap特征：

1）缩放：可实现多种缩放效果，如zoomToLongLat(经度，纬度，缩放比例) zoomToRectangle(左上经纬度，右下经纬度)等。

如果要支持基于地理信息的层级显示，这点还是很重要的，但ammap和fusionMap有个不好的地方是没有地理信息，如果需要涉及地理信息，如街道，乡镇名称就不要考虑了，推荐使用googleMap

2）对 image（在某一经纬度或始终在前面），movie， line ，dashed lines, cured line（设置line的curved=true）的支持

3）和世界地图组合可实现drill down 效果，就是点击世界地图中国部分，显示中国的省份地图，可以参考原包中的实例。

4）自定义对话框（InfoDescription类）

5）自定义图标，label，并基于经纬度定义,像素在地图上定位

6）将几个省份作为一组

7）TimeLine，可用来实现ppt, e-learning（timeline+zoom工具实现），基于时间变化的热量图（timeLine+地图），这个需要参考官方blog 8，我也没用过

只是对两者进行简单的比较，因为开发的工程中需要显示在地图上显示层级数据，需要缩放功能，所以选择Ammap，下面将以Ammap进行介绍。

Ammap教程

初始化显示：

[Embed(source="/assets/maps/china.swf")]

private var _china:Class;

dataSet.mapClass=_china;

<ammap:AmMap useObjectColorForBalloon="false" rollOverMapObject="rollOver(event)"

rollOutMapObject="rollOut(event)"    id="map" developerMode="false" backgroundColor="#FFFFF0"

showMapProgressBar="true" clickMapObject="onClickMapArea(event)" width="100%" height="100%"  >

    <ammap:areasSettings>

        <ammap:AreasSettings autoZoom="false"   rollOverColor="#7FFFD4" selectedColor="#7FFFD4" 
                unlistedAreasAlpha="0.5"    unlistedAreasColor="#808080"  />

    </ammap:areasSettings>

    <ammap:moviesSettings>

        <ammap:MoviesSettings centered="false" bringForwardOnHover="true"  rollOverColor="#CC0000" />

    </ammap:moviesSettings>

    <ammap:dataSets>

        <ammap:DataSet id="dataSet" leftLongitude="73.559248" topLatitude="53.560308" 
rightLongitude="134.775703" bottomLatitude="18.158606">

           <ammap:areas>

             <ammap:MapArea   instanceName="borders"  title="borders" color="#FFFFFF" mouseEnabled="false" />

           </ammap:areas>

        </ammap:DataSet>

    </ammap:dataSets>

.csharpcode, .csharpcode pre{font-size: small;color: black;font-family: consolas, "Courier New", courier, monospace;background-color: #ffffff;/*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt {background-color: #f4f4f4;width: 100%;margin: 0em;}.csharpcode .lnum { color: #606060; }

1. 如果使用下载文件中的sample加载后，图形显示金黄一片，并没有显示省名，多半是MapArea的 instanceName有错误，

2. 其中ammap:DataSet 设置左上，右下的经纬度确定map的显示范围，默认即可；

3. borders的MapArea是边界。mouseEnabled代表鼠标事件不捕获

4. 当进行菜单切换时，如果要实现reset效果，可以将dataSet清空，但一定要重新对左上和右下的经纬度赋值

map.cleanDataSet(dataSet);

dataSet.leftLongitude=73.559248;

dataSet.topLatitude=53.560308;

dataSet.rightLongitude=134.775703;

dataSet.bottomLatitude=18.158606;

5. 设置mapArea和mapMoive的默认样式

6. 当在地图上点击时，监听clickMapObject，其中event类型为MapObjectEvent

7. developerMode的开启可以显示调试信息,ctrl+0可复制到剪切板

8. ammap：label 可以支持html格式的标签

9. 启动时进入缩放，可通过设置DataSet的zoomLevel, zoomLong,zoomLat实现,url表示默认选中的MapMovie的Id，

修改tooltip相关样式

<ammap:balloon>     <ammap:AmBalloon fontSize="18" fillColor="#000000" color="#FFFFFF"/></ammap:balloon>

缩放工具和比例尺的使用

<ammap:AmMapLegend   id="legendBytes"  width="400" visible="true" backgroundAlpha="0.5" 
backgroundColor="#FFFFFF" bottom="5" left="{0.25*map.width}" borderColor="#666666" 
     borderStyle="solid" paddingTop="10" paddingBottom="10" paddingLeft="10" horizontalAlign="center">

        <ammap:LegendItem text="良好" markerColor="#179C17"/>

        <ammap:LegendItem text="轻微" markerColor="#117ED6"/>

        <ammap:LegendItem text="一般" markerColor="#FCFA51"/>

        <ammap:LegendItem text="紧急" markerColor="#FFA500"/>

        <ammap:LegendItem text="严重" markerColor="#FF0000"/>

    </ammap:AmMapLegend>

    <ammap:zoomControl>

        <ammap:ZoomControl id="zoom" buttonBorderColor="#000000" homeIconColor="#000000"/>

    </ammap:zoomControl>

.csharpcode, .csharpcode pre{font-size: small;color: black;font-family: consolas, "Courier New", courier, monospace;background-color: #ffffff;/white-space: pre;/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt {background-color: #f4f4f4;width: 100%;margin: 0em;}.csharpcode .lnum { color: #606060; } 注意事项：

1. area的颜色根据 value和solidColor自动生成，所以如果你要指定MapArea的颜色，一定不要设置vaule的值，不然你会发现MapArea的颜色在偷偷的改变。

2. 如果使用xml进行MapArea的赋值，注意group字段是MapObject的实例，而不是String ,实现方法是，先在一个循环中，实现MapArea中实现实例的赋值；然后对每一个MapArea group中的字符串进行遍历，对于每一个string，调用findObject得到其对应的MapArea。得到数组后，赋值给该MapArea，如： obj.linkWith=groupAreas;
3. 建议对每层数据设定固定的缩放比

4. 通过movie.movieClass赋值，可实现动画图标，但要求图标是swf格式，gif不支持

5. 当更新完数据后，调用 map.invalidateData(); 实现数据重新初始化

6. 在监听事件时，如果输出信息，调用 event.toString()函数。

7. 点击叶子节点后，叶子不消失的方法。按官方说法，只要你不设置叶子的 zoomLevel，并且其中没有包含MapMovie，并且设置movie.remainVisible=true;就不会消失。但我这有些问题，我的实现思路是：

当点击分支节点时，保存该分支节点到 selectedArea变量。

将叶子节点加入到该分支节点的movies数组中

当点击叶子节点时，设置当前选中对象为selectedArea

参考资料

下载包中的sample和 class reference