ArcGIS Image Server简介以及OL2中的加载

概述：

本文讲述Arcgis Image Server相关以及在OL2中如何加载Arcgis Server发布的影像服务。

ImageService简介：

ArcGIS Image Server为用户提供管理和处理海量栅格数据的能力，并提供基于GIS软件、CAD软件、影像处理软件和Web应用的企业级访问。

使用ArcGIS Image Server可将两个独立的阶段（影像处理和影像分发）集成在一起，从而管理员可仅维护原始影像，并可根据用户的需要动态的快速创建基于原始影像的多种影像产品。

ArcGIS Image Server支持影像服务的创建，包括多种格式，多种投影，多种分辨率的海量影像数据集。

ArcGIS Image Server的一个重要特征是其支持影像数据的 原始格式，而不需要创建特定的格式。

这些数据可以是预处理的产品，例如正射影像，也可以是半成品数据，例如空间配准之后仍存在重 叠区域的正射影像；或者原始影像，例如原始扫描帧或卫星影像。数据可以是不同的压缩或者未压缩格式，也可存储在DBMS中。 ArcGIS Image Server支持所有的ESRI支持的栅格格式，例如Geodatabase raster，TIFF，JPEG2000，也 支持特定数据厂商的格式，例如QuickBird，USGS DEM和MATCH-AT。

利用服务器强大的处理能力，可从单一的数据源生成多幅影像产品，每幅影像产品有不同的辐射处 理，几何处理，镶嵌规则和压缩方式。

支持的数据格式
o TIF
o RAW(BIL,BIP,BSQ)
o JPEG,PNG
o Arc/Info ASCII Grid
o Arc/Info Binary Grid (.adf)
o Microsoft Windows Device Independent Bitmap (.bmp)
o ERMapper Compressed Wavelets (.ecw)
o ESRI .hdr Labelled
o ENVI .hdr Labelled Raster
o Graphics Interchange Format (.gif)
o Erdas Imagine (.img)
o JPEG JFIF (.jpg)
o JPEG2000 (.jp2, .j2k)
o Erdas 7.x .LAN and .GIS
o NetCDF
o PCI .aux Labelled
o PCI Geomatics Database File
o Portable Network Graphics (.png)
o USGS ASCII DEM (.dem)

关键技术特性
 ? 快速访问影像数据
?  可伸缩的企业级客户/服务器架构
?  海量影像管理
?  直接访问多种文件格式和压缩格式
?  动态的基于服务器的影像处理
?  从单一源创建多种影像产品
?  开放的GIS和Web客户端支持
?  软件开发包
?  以最少的时间和最小的工作量使影像可访问

几何处理? 
      变形
?  地面到图像的转换（支持放射、投影、Warp Grid、正射纠正等转换方法）
?  输出到特定的投影
?  按照footprint或接缝裁剪影像
?  可定义的采样方法—最临近、双线性、立方卷积
?  从图像到输出采用单一采样
?  图像镶嵌（支持基于属性的镶嵌，如日期、质量、云覆盖等，也支持最临近底点镶嵌，支持不同方向视点的镶嵌，支持羽化的接缝线镶嵌等）
辐射处理? 
    从多波段影像提取/加入波段
?  计算归一化植被指数（NDVI）
?  直方图拉伸－亮度、对比度和gamma
?  图像代数－图像A（＋、－、×、/）图像B
?  分类－分类范围值
?  颜色表－颜色索引值
?  卷积过滤器－锐化影像
?  全色融合－融合全色波段和多波段
?  灰度－将彩色转为灰度
?  光谱矩阵－转换伪彩色为假彩色
?  光谱矩阵－转换伪彩色为假彩色

实现方式：

实现，通过网络请求，查看服务的请求地址，如下：

http://localhost:6080/arcgis/rest/services/lzugis/chinaimg/ImageServer/exportImage?f=image&bbox=20.573210198819083%2C15.563411013378278%2C183.21003918663314%2C57.48141724630558&imageSR=4326&bboxSR=4326&size=1292%2C333

其中有三个参数：

1、f，格式，为常量image；

2、bbox，是请求的地图四至；

3、size，是当前分辨率/比例尺下图层的大小。

因此，我们只需修改WMS图层中的URL如此格式即可。

完整代码如下：

OpenLayers.Layer.AgsImageLayer = OpenLayers.Class(OpenLayers.Layer.Grid, {
    DEFAULT_PARAMS: { service: "WMS",
                      version: "1.1.1",
                      request: "GetMap",
                      styles: "",
                      format: "image/jpeg"
                     },
    
    isBaseLayer: true,
    encodeBBOX: false,
    noMagic: false,
    layers:"",
    filter:"",
    yx: {},
    initialize: function(name, url, params, options) {
        var newArguments = [];
        params = OpenLayers.Util.upperCaseObject(params);
        this.layers = params.LAYERS;
        this.filter=params.FILTER;
        if (parseFloat(params.VERSION) >= 1.3 && !params.EXCEPTIONS) {
            params.EXCEPTIONS = "INIMAGE";
        } 
        newArguments.push(name, url, params, options);
        OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
        OpenLayers.Util.applyDefaults(
                       this.params, 
                       OpenLayers.Util.upperCaseObject(this.DEFAULT_PARAMS)
                       );

        if (!this.noMagic && this.params.TRANSPARENT && 
            this.params.TRANSPARENT.toString().toLowerCase() == "true") {
            if ( (options == null) || (!options.isBaseLayer) ) {
                this.isBaseLayer = false;
            } 
            if (this.params.FORMAT == "image/jpeg") {
                this.params.FORMAT = OpenLayers.Util.alphaHack() ? "image/gif"
                                                                 : "image/png";
            }
        }

    },    
    reverseAxisOrder: function() {
        var projCode = this.projection.getCode();
        return parseFloat(this.params.VERSION) >= 1.3 && 
            !!(this.yx[projCode] || (OpenLayers.Projection.defaults[projCode] && 
            OpenLayers.Projection.defaults[projCode].yx));
    },
    getURL: function (bounds) {
        bounds = this.adjustBounds(bounds);
        var imageSize = this.getImageSize();
        var newParams = {};
        var reverseAxisOrder = this.reverseAxisOrder();
        newParams.BBOX = this.encodeBBOX ?
            bounds.toBBOX(null, reverseAxisOrder) :
            bounds.toArray(reverseAxisOrder);
        newParams.WIDTH = imageSize.w;
        newParams.HEIGHT = imageSize.h;
        var requestString = this.getFullRequestString(newParams);
        return requestString;
    },
    getFullRequestString:function(newParams) {
    	var url = this.url;
        if (OpenLayers.Util.isArray(url)) {
            url = this.selectUrl(s, url);
        }
        url = url+'/exportImage?f=image&bbox=${bbox}&size=${size}';
        var layers = "show:"+this.layers;
        var layerDefs = '{"'+this.layers+'":"'+this.filter+'"}';
        url = OpenLayers.String.format(url, {
        	'bbox': newParams.BBOX.toString(),
        	'size':newParams.WIDTH+","+newParams.HEIGHT
        });
        return url;
    },
    CLASS_NAME: "OpenLayers.Layer.AgsImageLayer"
});

页面调用代码如下：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>openlayers map</title>
    <link rel="stylesheet" href="../../../plugin/OpenLayers-2.13.1/theme/default/style.css" type="text/css">
    <style>
        html, body, #map{
            padding:0;
            margin:0;
            height:100%;
            width:100%;
            overflow: hidden;
        }
    </style>
    <script src="../../../plugin/OpenLayers-2.13.1/OpenLayers.js"></script>
    <script src="../../../plugin/jquery/jquery-1.8.3.js"></script>
    <script src="extend/AgsImageLayer.js"></script>
    <script>
        var map;
        var tiled;
        OpenLayers.IMAGE_RELOAD_ATTEMPTS = 5;
        OpenLayers.DOTS_PER_INCH = 25.4 / 0.28;
        $(window).load(function() {
            var format = 'image/png';
            var bounds = new OpenLayers.Bounds(
                    73.45100463562233, 18.16324718764174,
                    134.97679764650596, 53.531943152223576
            );
            var options = {
                controls: [],
                maxExtent: bounds,
                maxResolution: 0.2403351289487642,
                projection: "EPSG:4326",
                units: 'degrees'
            };
            map = new OpenLayers.Map('map', options);
            var time = new Date();
            time = time.getTime();
            var url = "http://localhost:6080/arcgis/rest/services/lzugis/chinaimg/ImageServer";
            tiled = new OpenLayers.Layer.AgsImageLayer(
                    "agsimglyr",
                    url,
                    {
                        format: format
                    },
                    {
                        isBaseLayer: true,
                        singleTile: true
                    }
            );
            map.addLayers([tiled]);
            map.addControl(new OpenLayers.Control.Zoom());
            map.addControl(new OpenLayers.Control.Navigation());
            map.zoomToExtent(bounds);
        });
    </script>
</head>
<body>
<div id="map"></div>
</body>
</html>

---------------------------------------------------------------------------------------------------------------

技术博客

http://blog.csdn.NET/gisshixisheng

在线教程

http://edu.csdn.Net/course/detail/799
Github

https://github.com/lzugis/

联系方式

q       q:1004740957

e-mail:niujp08@qq.com

公众号:lzugis15

Q Q 群:452117357(webgis)
             337469080(Android)