zoukankan      html  css  js  c++  java
  • ArcGIS Viewer for Flex中引入google map作底图

      

      在ArcGIS Viewer for Flex开发中,经常需要用到google map作为底图,我们不能通过ArcGIS Viewer for Flex - Application Builder轻易的引入google map 作为底图,需要通过程序重写TiledMapServiceLayer来扩展从而加载google map。

      

      这里有写好的GoogleMapLayer.as文件:

    package com.esri.viewer
    {
        import com.esri.ags.SpatialReference;
        import com.esri.ags.geometry.Extent;
        import com.esri.ags.geometry.MapPoint;
        import com.esri.ags.layers.TiledMapServiceLayer;
        import com.esri.ags.layers.supportClasses.LOD;
        import com.esri.ags.layers.supportClasses.TileInfo;
        
        import flash.net.URLRequest;
        
        //扩展TiledMapServiceLayer图层实现加载google地图
        public class GoogleMapLayer extends TiledMapServiceLayer
        {
            private var _tileInfo:TileInfo=new TileInfo();
            private var _baseURL:String="";
            public var mapStyle:String=""; 
            
            public function GoogleMapLayer()
            {
                super();
                buildTileInfo();
                setLoaded(true);
            }
            
            override public function get fullExtent():Extent
            {
                return new Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, new SpatialReference(102113));
            }
            
            override public function get initialExtent():Extent
            {
                return new Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, new SpatialReference(102113));
            }
            
            override public function get spatialReference():SpatialReference
            {
                return new SpatialReference(102113);
            }
            
            override public function get tileInfo():TileInfo
            {
                return _tileInfo;
            }
            
            //获取矢量地图
            override protected function getTileURL(level:Number, row:Number, col:Number):URLRequest
            {            
                var s:String = "Galileo".substring(0, ((3 * x + y) % 8)); 
                var url:String; 
                
                //获取矢量地图             
                if(mapStyle == "Vector")                 
                {                 
                    url = "http://mt"+(col%4)+".google.com/vt/lyrs=m@158000000&hl=zh-CN&gl=cn&" +                     
                        "x=" + col + "&" +                     
                        "y=" + row + "&" +                 
                        "z=" + level+ "&" +                 
                        "s=" + s;                 
                }                 
                    
                    //获取地形图
                else if(mapStyle == "Terrain")                 
                {                 
                    url = "http://mt"+(col%4)+".google.cn/vt/lyrs=t@131,r@227000000&hl=zh-CN&gl=cn&" +                     
                        "x=" + col + "&" +                     
                        "y=" + row + "&" +                     
                        "z=" + level+ "&" +                     
                        "s=" + s; 
                }
                    
                    //获取影像地图
                else if(mapStyle == "Image")                 
                {                 
                    url = "http://mt"+(col%4)+".google.com/vt/lyrs=s&hl=en&gl=en&" +                     
                        "x=" + col + "&" +                     
                        "y=" + row + "&" +                     
                        "z=" + level+ "&" +                     
                        "s=" + s;
                } 
                    
                    //获取道路等POI,和影像地图配合使用     
                else if(mapStyle == "POI")            
                {                 
                    url = "http://mt"+(col%4)+".google.com/vt/imgtp=png32&lyrs=h@169000000&hl=zh-CN&gl=cn&" +                     
                        "x=" + col + "&" +                     
                        "y=" + row + "&" +                     
                        "z=" + level+ "&" +                     
                        "s=" + s;                 
                } 
                
                return new URLRequest(url);
            }
            
            private function buildTileInfo():void
            {
                _tileInfo.height=256;
                _tileInfo.width=256;
                _tileInfo.origin=new MapPoint(-20037508.342787, 20037508.342787);
                _tileInfo.spatialReference=new SpatialReference(102113);
                _tileInfo.lods = [
                    new LOD(0, 156543.033928, 591657527.591555), 
                    new LOD(1, 78271.5169639999, 295828763.795777), 
                    new LOD(2, 39135.7584820001, 147914381.897889), 
                    new LOD(3, 19567.8792409999, 73957190.948944), 
                    new LOD(4, 9783.93962049996, 36978595.474472), 
                    new LOD(5, 4891.96981024998, 18489297.737236), 
                    new LOD(6, 2445.98490512499, 9244648.868618), 
                    new LOD(7, 1222.99245256249, 4622324.434309), 
                    new LOD(8, 611.49622628138, 2311162.217155), 
                    new LOD(9, 305.748113140558, 1155581.108577), 
                    new LOD(10, 152.874056570411, 577790.554289), 
                    new LOD(11, 76.4370282850732, 288895.277144), 
                    new LOD(12, 38.2185141425366, 144447.638572), 
                    new LOD(13, 19.1092570712683, 72223.819286), 
                    new LOD(14, 9.55462853563415, 36111.909643), 
                    new LOD(15, 4.77731426794937, 18055.954822),
                    new LOD(16, 2.38865713397468, 9027.977411), 
                    new LOD(17, 1.19432856685505, 4513.988705), 
                    new LOD(18, 0.597164283559817, 2256.994353),
                    new LOD(19, 0.298582141647617, 1128.497176)
                ];
            }
        }
    }

      

      具体步骤如下:

      第一步:将文件GoogleMapLayer.as放到com.esri.viewer包下

      

      

      第二步:在MapManager.mxml文件中:

      (1)引入包com.esri.viewer.GoogleMapLayer。

      

      (2)在addLayerToMap函数中添加:

      

      第三步:在LayerCreator.as文件中

      (1)引入包com.esri.viewer.GoogleMapLayer:

      

      (2)在createLayer函数中添加:

    else if (layerType == "googlemap")
    {
        return createGoogleLayer(layerCreationProperties);
    }

      (3)添加函数createGoogleLayer:  

      private static function createGoogleLayer(layerCreationProperties:LayerCreationProperties):GoogleMapLayer
        {
            var googleLayer:GoogleMapLayer=new GoogleMapLayer();
            googleLayer.name=layerCreationProperties.label;
            if (layerCreationProperties.style)
            {
                googleLayer.mapStyle= layerCreationProperties.style;
            }
            googleLayer.id=layerCreationProperties.label;
            googleLayer.alpha=layerCreationProperties.alpha;
            googleLayer.visible=layerCreationProperties.visible;
            
            return googleLayer;
        }

      第四步:在config.xml配置文件中添加basemaps: 

    <basemaps>
         <layer label="GoogleMapLayer"  type="GoogleMap" icon="assets/images/birds.png"  style="Terrain" visible="true"/>
    </basemaps>

      运行结果:

      

  • 相关阅读:
    常见分布式锁的基本实现
    Xen安装部署和基本原理
    Android应用在不同版本间兼容性处理
    Android 在fragment中实现返回键单击提醒 双击退出
    Android使用的webcview中带有音乐播放控件,在关闭或分享时处于界面不可见状态下,声音仍在播放的问题解决
    Android 使用WebView浏览有声音或者视频的网页,关闭WebView之后,声音或者视频不停止的解决办法
    Android 自带Base64加密解密
    Android java.lang.RuntimeException: Canvas: trying to use a recycled bitmap android.graphics.Bitmap@412d7230
    Android 微信SDK图片分享(checkArgs fail, thumbData is invalid)
    Android之Glide获取图片Path和Glide获取图片Bitmap
  • 原文地址:https://www.cnblogs.com/danshui/p/3285859.html
Copyright © 2011-2022 走看看