• arcgis jsapi 调用google地区服务


        做地理信息系统(GIS)项目,除了实现功能用户体验度要好之外,最重要的是地图渲染效果更要好。很多时候苦于数据的完整性和对于配图的审美观,程序猿们都很难配出好看的地图效果。基于上述一般直接调用google的地图服务,包括矢量地图,地形地图和影像地图。这样就不用花大力气关注于数据的问题,只需要把地图的操作功能实现就行。下面来说说如何基于arcgis js api 调用google的地图服务。

         首先我们需要知道google地图服务的地址:

              http://mt.google.cn/vt/lyrs=s@112&hl=zh-CN&gl=cn  //卫星地图服务

              http://mt.google.cn/vt/lyrs=h@177000000&hl=zh-CN&gl=cn    //地区名称矢量地图服务

             http://mt.google.cn/vt/lyrs=m@112&hl=zh-CN&gl=cn    //矢量地图服务

    jsapi 初始化google地图服务实现代码:

    initGoogleMapLayer:function(){
    				dojo.declare("GoogleMapLayer", esri.layers.TiledMapServiceLayer, { // create WMTSLayer by extending esri.layers.TiledMapServiceLayer
    		        constructor: function(){
    		            this.spatialReference = new esri.SpatialReference({
    		                wkid: 102113
    		            });
    		            this.initialExtent = new esri.geometry.Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, this.spatialReference);
    		            this.fullExtent = new esri.geometry.Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, this.spatialReference);
    		            //
    		            this.tileInfo = new esri.layers.TileInfo({
    		                "dpi": "90.71428571427429",
    		                "format": "image/png",
    		                "compressionQuality": 0,
    		                "spatialReference": {
    		                    "wkid": "3857"
    		                },
    		                "rows": 256,
    		                "cols": 256,
    		                "origin": {
    		                    "x": -20037508.342787,
    		                    "y": 20037508.342787
    		                },
    		                
    		                // Scales in DPI 96
    		                "lods": [{"level": 0,"scale": 591657527.591555,"resolution": 156543.033928
    		                }, {"level": 1,"scale": 295828763.795777,"resolution": 78271.5169639999
    		                }, {"level": 2,"scale": 147914381.897889,"resolution": 39135.7584820001
    		                }, {"level": 3,"scale": 73957190.948944,"resolution": 19567.8792409999
    		                }, {"level": 4,"scale": 36978595.474472,"resolution": 9783.93962049996
    		                }, {"level": 5,"scale": 18489297.737236,"resolution": 4891.96981024998
    		                }, {"level": 6,"scale": 9244648.868618,"resolution": 2445.98490512499
    		                }, {"level": 7,"scale": 4622324.434309,"resolution": 1222.99245256249
    		                }, {"level": 8,"scale": 2311162.217155,"resolution": 611.49622628138
    		                }, {"level": 9,"scale": 1155581.108577,"resolution": 305.748113140558
    		                }, {"level": 10,"scale": 577790.554289,"resolution": 152.874056570411
    		                }, {"level": 11,"scale": 288895.277144,"resolution": 76.4370282850732
    		                }, {"level": 12,"scale": 144447.638572,"resolution": 38.2185141425366
    		                }, {"level": 13,"scale": 72223.819286,"resolution": 19.1092570712683
    		                }, {"level": 14,"scale": 36111.909643,"resolution": 9.55462853563415
    		                }, {"level": 15,"scale": 18055.954822,"resolution": 4.77731426794937
    		                }, {"level": 16,"scale": 9027.977411,"resolution": 2.38865713397468
    		                }, {"level": 17,"scale": 4513.988705,"resolution": 1.19432856685505
    		                }, {"level": 18,"scale": 2256.994353,"resolution": 0.597164283559817
    		                }, {"level": 19,"scale": 1128.497176,"resolution": 0.298582141647617
    		                }]
    		            });
    		            this.loaded = true;
    		            this.onLoad(this);
    		        },
    		        getTileUrl: function(level, row, col){
    		        	return "http://mt" + (col % 4) + ".google.cn/vt/lyrs=s@112&hl=zh-CN&gl=cn&" + "x=" + col + "&" +
    		            "y=" +
    		            row +
    		            "&" +
    		            "z=" +
    		            level +
    		            "&s=";
    		        }
    		    });
    		    
    		    dojo.declare("GoogleMapAnooLayer", esri.layers.TiledMapServiceLayer, { // create WMTSLayer by extending esri.layers.TiledMapServiceLayer
    		        constructor: function(){
    		            this.spatialReference = new esri.SpatialReference({
    		                wkid: 102113
    		            });
    		            this.initialExtent = new esri.geometry.Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, this.spatialReference);
    		            this.fullExtent = new esri.geometry.Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, this.spatialReference);
    		            //
    		            this.tileInfo = new esri.layers.TileInfo({
    		                "dpi": "90.71428571427429",
    		                "format": "image/png",
    		                "compressionQuality": 0,
    		                "spatialReference": {
    		                    "wkid": "3857"
    		                },
    		                "rows": 256,
    		                "cols": 256,
    		                "origin": {
    		                    "x": -20037508.342787,
    		                    "y": 20037508.342787
    		                },
    		                
    		                // Scales in DPI 96
    		                "lods": [{"level": 0,"scale": 591657527.591555,"resolution": 156543.033928
    		                }, {"level": 1,"scale": 295828763.795777,"resolution": 78271.5169639999
    		                }, {"level": 2,"scale": 147914381.897889,"resolution": 39135.7584820001
    		                }, {"level": 3,"scale": 73957190.948944,"resolution": 19567.8792409999
    		                }, {"level": 4,"scale": 36978595.474472,"resolution": 9783.93962049996
    		                }, {"level": 5,"scale": 18489297.737236,"resolution": 4891.96981024998
    		                }, {"level": 6,"scale": 9244648.868618,"resolution": 2445.98490512499
    		                }, {"level": 7,"scale": 4622324.434309,"resolution": 1222.99245256249
    		                }, {"level": 8,"scale": 2311162.217155,"resolution": 611.49622628138
    		                }, {"level": 9,"scale": 1155581.108577,"resolution": 305.748113140558
    		                }, {"level": 10,"scale": 577790.554289,"resolution": 152.874056570411
    		                }, {"level": 11,"scale": 288895.277144,"resolution": 76.4370282850732
    		                }, {"level": 12,"scale": 144447.638572,"resolution": 38.2185141425366
    		                }, {"level": 13,"scale": 72223.819286,"resolution": 19.1092570712683
    		                }, {"level": 14,"scale": 36111.909643,"resolution": 9.55462853563415
    		                }, {"level": 15,"scale": 18055.954822,"resolution": 4.77731426794937
    		                }, {"level": 16,"scale": 9027.977411,"resolution": 2.38865713397468
    		                }, {"level": 17,"scale": 4513.988705,"resolution": 1.19432856685505
    		                }, {"level": 18,"scale": 2256.994353,"resolution": 0.597164283559817
    		                }, {"level": 19,"scale": 1128.497176,"resolution": 0.298582141647617
    		                }]
    		            });
    		            this.loaded = true;
    		            this.onLoad(this);
    		        },
    		        getTileUrl: function(level, row, col){
    		            return "http://mt" + (col % 4) + ".google.cn/vt/lyrs=h@177000000&hl=zh-CN&gl=cn&" + "x=" + col + "&" +
    		            "y=" +
    		            row +
    		            "&" +
    		            "z=" +
    		            level +
    		            "&s=";
    		        }
    		    });
    		}


    arcgis jsapi调用初始化的google地图服务:

    var googleMapLayer = new GoogleMapLayer();
    map.addLayer(googleMapLayer); 


    通过上面的代码实现就能把google地图服务,添加到自己的项目中。

  • 相关阅读:
    order by子句
    having和where的区别
    O2O模式为什么这么火
    高德----------百度地图
    list后台转化为JSON的方法ajax
    ajax中后台string转json
    ERROR: JDWP Unable to get JNI 1.2 environment, jvm->GetEnv() return code = -2
    压缩文件解压
    个人作业3——个人总结(Alpha阶段)
    第08周-集合与泛型
  • 原文地址:https://www.cnblogs.com/dyllove98/p/3161497.html
Copyright © 2020-2023  润新知