ArcGIS JS API使用本地切片

记录步骤如下:

        假设已经有了地图瓦片数据,无论是ArcGIS,还是百度、高德、天地图,在这个文章里,使用的是ArcGIS地图瓦片数据。ArcMap发布缓存地图服务后会在server的目录下生成切片数据。

ArcGIS JS API使用本地切片_第1张图片

 

1、复制_alllayers目录到IIS或者tomcat的服务器目录下,再了解下ArcGIS切片的目录结构。

ArcGIS JS API使用本地切片_第2张图片

ArcGIS JS API使用本地切片_第3张图片

 

2、在Conf.xml和conf.cdi文件中获取切片数据的参数信息。

ArcGIS JS API使用本地切片_第4张图片

3、自定义切片图层类。

define(["dojo/_base/declare",
    "esri/layers/TiledMapServiceLayer",
    "esri/SpatialReference",
    "esri/geometry/Extent",
    "esri/layers/TileInfo"], function (declare, TiledMapServiceLayer) {
    return declare('customTileLyr',TiledMapServiceLayer, {   //没定义类名,就以文件名为准     第一个参数是父类
        constructor: function (baseUrl) {
            this.url=baseUrl;        //下面的参数信息参考2中的截图
            this.spatialReference = new esri.SpatialReference({ wkid: 4326   });
            this.initialExtent = this.fullExtent = new esri.geometry.Extent(73.45100463562233, 18.159038005131432, 134.97679764650596, 53.531943152223576, this.spatialReference);
            this.tileInfo = new esri.layers.TileInfo({
                "rows": 256,
                "cols": 256,
                "compressionQuality": 0,
                "origin": {"x": -400.0, "y": 400.0},  
                "spatialReference": { "wkid": 4326 },
                "lods": [
                    {"level": 0, "scale": 32000000, "resolution": 0.07614275218656896},
                    {"level": 1, "scale": 16000000, "resolution": 0.03807137609328448},
                    {"level": 2, "scale": 8000000, "resolution": 0.01903568804664224},
                    {"level": 3, "scale": 4000000, "resolution": 0.00951784402332112},
                    {"level": 4, "scale": 2000000, "resolution": 0.00475892201166056},
                    {"level": 5, "scale": 1000000, "resolution": 0.00237946100583028},
                    {"level": 6, "scale": 500000, "resolution": 0.00118973050291514}]
            });
            this.loaded = true;
            this.onLoad(this);
        },
        getTileUrl: function (level, row, col) {
            return "http://localhost/_alllayers/" +
                "L" + dojo.string.pad(level, 2, '0') + "/" +
                "R" + dojo.string.pad(row.toString(16), 8, '0') + "/" +
                "C" + dojo.string.pad(col.toString(16), 8, '0') + "." +
                "png";
        }
    });
});

4、使用自定义图层类显示地图。



    
        
        本地瓦片地图
        
        
        
        
        
    
    
        

对于其他本地瓦片地图,套路都是一样的。最终效果图如下:

ArcGIS JS API使用本地切片_第5张图片

你可能感兴趣的:(ArcGIS,JS,API)