/// <summary>
/// 矢量地图文档资源_以瓦片方式
/// </summary>
import {Zondy} from '../../service/common/Base';
import {newGuid} from '../../service/common/Util';
import TileImage
from 'ol/source/TileImage.js';
import * as ol_extent
from 'ol/extent.js';
import TileGrid
from 'ol/tilegrid/TileGrid.js';
import {inherits} from 'ol/util.js';
import {assign} from 'ol/obj.js';
import {appendParams} from 'ol/uri.js';
import TileLayer
from 'ol/layer/Tile.js';
var MapLayerTileSource = function (opt_options) {
var options = opt_options !== undefined ? opt_options : {};
/**
* @private
* @type {Array.<number>}
* 创建网格(内部调用)
*/
TileImage.call(this, {
attributions: options.attributions,
logo: options.logo,
opaque: options.opaque,
state: options.state !== undefined ? options.state : undefined,
tilePixelRatio: options.tilePixelRatio,
wrapX: options.wrapX,
projection: options.projection,
crossOrigin: options.crossOrigin !== undefined ? options.crossOrigin : null //"anonymous"为跨域调用,
});
/**
* @public
* @type {string}
* 地图服务请求地址（可通过初始对象的options赋值）
*/
this.ip = options.ip !== undefined ? options.ip : "127.0.0.1";
/**
* @public
* @type {string}
* 地图服务请求端口（可通过初始对象的options赋值）
*/
this.port = options.port !== undefined ? options.port : "6163";
/**
* @public
* @type {Array.<string>}
* 要显示的矢量图层的URL地址
*/
this.gdbps = options.gdbps !== undefined ? options.gdbps : null;
if (this.gdbps == null) {
alert("当前没有赋值要显示的矢量图层！");
return;
}
/**
* @public
* @type {number}
* 最大分辨率,新瓦片必须指定
*/
this.maxResolution = options.maxResolution !== undefined ? options.maxResolution : null;
//根据投影获取地图范围
var tileProjection = options.projection !== undefined ? options.projection : null;
//地图范围
var layerExtent = [-180, -90, 180, 90];
if (tileProjection != null) {
layerExtent = tileProjection.getExtent();
}
//设置图层范围
this.extent = options.extent !== undefined ? options.extent : layerExtent;
/**
* @public
* @type {number}
* 动态裁图瓦片地图总级数
*/
this.maxZoom = options.maxZoom !== undefined ? options.maxZoom : 16;
/**
* @public
* @type {number}
* 地图图片大小
*/
this.tileSize = options.tileSize !== undefined ? options.tileSize : 256;
//分辨率数组，根据传入的分辨率或范围计算得到
this.resolutions = this.getResolutions();
this.origin = options.origin !== undefined ? options.origin : ol_extent.getTopLeft(this.extent);
this.rlt = Math.random();
this.f = options.f !== undefined ? options.f : "png";
/**
* @public
* @type {string}
* 用户指定的图层过滤条件，它由多个键值对组成，值为您所要设定的过滤条件。
* eg：'1:ID>4,3:ID>1'
* 中文请使用UTF-8编码后再传入参数
* javascitpt中请使用encodeURI（）函数编码后再代入filters参数中
* 注意，在此函数中“：”和“，”是保留字符，用于表示键值对概念和分隔不同图层的条件，请不要将这2个字符用于自定义条件中
*/
this.filters = options.filters != undefined ? options.filters : null;
/**
* @public
* @type {Zondy.Object.CDisplayStyle}
* 显示参数
*/
this.style = options.style != undefined ? options.style : null;
/**
* @private
* @type {string}
* 客户端标识，用以服务器缓存地图，一般情况下无需赋值
*/
this.guid = options.guid !== undefined ? options.guid : newGuid();
/**
* @public
* @type {string}
* 请求使用的网格协议，默认http协议
*/
this.networkProtocol = options.networkProtocol !== undefined ? options.networkProtocol : location.protocol.split(":")[0] || "http";
/**
* @public
* @type {string}
* 请求使用的域名，基地址
*/
this.domain = options && options.domain ? options.domain : '';
/**
* @private
* true表示动态裁图的方式显示出图
*/
this.tileGrid = new TileGrid({
origin: this.origin, //数组类型，如[0,0],
resolutions: this.resolutions, //分辨率
tileSize: this.tileSize //瓦片图片大小
});
this.tileUrlFunction = options.tileUrlFunction !== undefined ? options.tileUrlFunction : this.tileUrlFunctionExtend;
//by xie
/**
* 设置投影参考系，参考系名
* @private
* @type {string}
* 非必要参数，无须赋值
*/
this.proj = options.proj;
/**
* @protected
* @type {ol.TileUrlFunctionType}
* 拼接取图地址方法
*/
//this.tileUrlFunction = options.tileUrlFunction !== undefined ? options.tileUrlFunction :this.tileUrlFunctionExtend;
/**
* @type {string}
* @description ShapeFile的服务器shp文件路径
*/
this.mapstyUri = options.mapstyUri;
/**
* @type {Object}
* @description ShapeFile的服务器样式文件xml路径
*/
this.mapstyOption = options.mapstyOption;
//this.url_ = "http://" + this.ip + ":" + this.port + "/igs/rest/mrms/layers";
if (this.domain === '') {
this.url_ = this.networkProtocol + "://" + this.ip + ":" + this.port + "/igs/rest/mrms/layers";
}else {
this.url_ = this.domain + "/igs/rest/mrms/layers";
}
};
inherits(MapLayerTileSource, TileImage);
/**
* 创建分辨率数组
*/
MapLayerTileSource.prototype.getResolutions = function () {
if (this.maxResolution == null) {
var width = ol_extent.getWidth(this.extent);
var height = ol_extent.getHeight(this.extent);
this.maxResolution = (width >= height ? height : width) / (this.tileSize);
}
var opt_resolutions = new Array(this.maxZoom);
for (var z = 0; z < this.maxZoom; ++z) {
opt_resolutions[z] = this.maxResolution / Math.pow(2, z);
}
return opt_resolutions;
};
/**
* 拼接url取图地址
* @param {Array.<number>} tileCoord 数据格式包含级数、行号、列号.
* @param {string} pixelRatio 像素比率
* @param {ol.proj.Projection} projection 投影
*/
MapLayerTileSource.prototype.tileUrlFunctionExtend = function (tileCoord, pixelRatio, projection) {
//判断返回的当前级数的行号和列号是否包含在整个地图范围内
if (this.tileGrid != null) {
var tileRange = this.tileGrid.getTileRangeForExtentAndZ(this.extent, tileCoord[0], tileRange);
if (!tileRange.contains(tileCoord)) {
return;
}
}
//根据行列号，计算当前取图的范围即Bbox
var cur_resolution = null;
if (this.maxResolution != null) {
cur_resolution = this.maxResolution / Math.pow(2, tileCoord[0]);
}
//定义参数
var params = {
'f': this.f,
'rlt': this.rlt,
'guid': this.guid,
'mapstyUri': '',
'mapstyOption': {}
};
if (this.gdbps != null && this.gdbps != "") {
assign(params, {'gdbps': this.gdbps.join(',')});
}
//设置地图文档显示样式
if (this.style != null) {
assign(params, {'style': JSON.stringify(this.style)});
}
//设置过滤条件
if (this.filters != null) {
assign(params, {'filters': this.filters});
}
//设置投影转换过滤条件
if (this.proj != null) {
assign(params, {'proj': this.proj});
}
//计算一张瓦片的范围
//var h = this.tileSize * cur_resolution;
// var tileR = window.ol.TileRange(tileCoord[1],tileCoord[1],tileCoord[2],tileCoord[2]);
var tileR = {
minX: tileCoord[1],
maxX: tileCoord[1],
minY: tileCoord[2],
maxY: tileCoord[2]
};
var opt_extent = null;
var bbox = this.tileGrid.getTileRangeExtent(tileCoord[0], tileR, opt_extent);
params['w'] = this.tileSize;
params['h'] = this.tileSize;
params['bbox'] = bbox.join(',');
params['mapstyUri'] = this.mapstyUri;
params['mapstyOption'] = JSON.stringify(this.mapstyOption);
return appendParams(this.url_, params);
};
export {MapLayerTileSource};
Zondy.Source.MapLayerTileSource = MapLayerTileSource;
/// <summary>显示矢量图层的功能服务构造函数</summary>
/// <param {string} opt_name 图层名称，无实际意义可为null.</param>
/// <param {Array.<string>} opt_gdbps 要显示的图层地址，数组类型,
/// 如: ["gdbps= gdbp://MapGisLocal/示例数据/ds/世界地图/sfcls/海洋陆地","gdbp://MapGisLocal/示例数据/ds/世界地图/sfcls/国界"].
/// </param>
/// <param name="opt_options" type="Object">属性键值对</param>
/**
* @class Zondy.Map.GdbpLayer
* @classdesc GdbpLayer显示矢量图层
* @description Zondy.Map.GdbpLayer
* @param opt_name - {String} 可选项，显示瓦片地图的名称，无实际意义，可为NULL。
* @param opt_gdbps - {String} 必选项，简单要素类的URL地址信息（包括源要素类存储路径与名称），用户根据语法设置URL地址，或在数据库中图层节点上右击选择“复制URL”获得。多个间用“，”号隔开。如: ["gdbps= gdbp://MapGisLocal/示例数据/ds/世界地图/sfcls/海洋陆地","gdbp://MapGisLocal/示例数据/ds/世界地图/sfcls/国界"]。
* @param opt_options - {Object} 必选项，设置其他属性键值对对象。对象中的属性来自本类的属性。例如：{key1：value1, key2：value2 …}
* @param {String} [opt_options.ip = ''] 必选项，服务器ip地址，本地为“127.0.0.1”或“localhost”。
* @param {String} [opt_options.port = '6163'] 必选项，服务器端口号，默认值6163
* @param {String[]} [opt_options.gdbps = ''] 可选项，简单要素类的URL地址信息（包括源要素类存储路径与名称），用户根据语法设置URL地址，或在数据库中图层节点上右击选择“复制URL”获得。多个间用“，”号隔开。如: ["gdbps= gdbp://MapGisLocal/示例数据/ds/世界地图/sfcls/海洋陆地","gdbp://MapGisLocal/示例数据/ds/世界地图/sfcls/国界"]。
* @param {String} [opt_options.f = 'png'] 可选项，图像类型，取值为：jpg|png|gif，默认值png
* @param {String} [opt_options.filters = ''] 可选项，图层过滤条件，它由多个键值对组成，值为您所要设定的过滤条件。如：'1:ID>4,3:ID>1”。过滤条件中用到的符号包括“==”、“!=”、“<”、“>”、“<=”、“>=”、“..”、“~”等，当包含中文条件时，请使用UTF-8编码格式，其中“：”和“，”为保留字符，用于表示键值对概念和分隔不同图层的条件，请不要将这2个字符用于自定义条件中，javascitpt中请使用encodeURI（）函数编码后再代入filters参数中。
* @param {Zondy.Object.CDisplayStyle[]} [opt_options.style = ''] 可选项，矢量图层显示样式参数，与图层序号相对应。
* @param {Number[]} [opt_options.extent = ''] 可选项，图层数据范围
* @param {String} [opt_options.guid = ''] 可选项，矢量图层缓存的唯一标识，一般情况下无需赋值。
* @example
//定义地图文档图层和地图
var VecLayer, map;
//初始化地图显示
function init() {
//地图范围
var extent = [634883.45517486, 3423051.6221381, 643377, 3431937.8];
//投影坐标系
var projection = new ol.proj.Projection({ units: ol.proj.Units.METERS, extent: extent });
//中心点
var center = ol.extent.getCenter(extent);
//图层显示名称
var name = "MapGIS IGS VecLayer";
//要显示的图层的gdbps地址
var gdbps = ["gdbp://MapGisLocal/sample/ds/地图综合/sfcls/水系"];
//创建一个图层
VecLayer = new Zondy.Map.GdbpLayer(name, gdbps, {
ip: "develop.smaryun.com",
port: "6163", //访问IGServer的端口号，.net版为6163，Java版为8089,
extent:extent,
mapstyUri: 'mapstyUri',
mapstyOption: 'mapstyOption'
});
//创建一个地图容器
map = new ol.Map({
//目标DIV
target: 'mapCon',
//添加图层到地图容器中
layers: [VecLayer],
view: new ol.View({
center: center,
projection: projection,
zoom: 2
})
});
}
*/
var GdbpLayer = function (opt_name, opt_gdbps, opt_options) {
var options = opt_options ? opt_options : {};
assign(options, {'layerName': opt_name});
assign(options, {'gdbps': opt_gdbps});
assign(options, {'source': !!options.source ? options.source : new MapLayerTileSource(options)});
TileLayer.call(this, options);
this.options = {};
assign(this.options, options);
assign(this, options);
}
inherits(GdbpLayer, TileLayer);
/**
* Source for MapGIS servers
* 刷新地图，重新取图，但保留了原有的GUID的标识
*/
/**
* @function Zondy.Map.GdbpLayer.refresh
* @description 刷新地图，重新取图，但保留了原有的guid的标识。
* @example
* VecLayer.refresh()
*/
GdbpLayer.prototype.refresh = function () {
this.setSource(null);
var opt_guid = this.options.source.guid;
assign(this.options, {'guid': opt_guid});
if (this.style !== undefined && this.style !== null) {
assign(this.options, {'style': this.style});
}
if (this.filters !== undefined && this.filters !== null) {
assign(this.options, {'filters': this.filters});
}
this.options.source = new MapLayerTileSource(this.options);
this.setSource(this.options.source);
}
/**
* Source for MapGIS servers
* 获取地图样式
*/
/**
* @function Zondy.Map.GdbpLayer.getStyle
* @description 获取地图文档显示样式参数信息。
* @return {Zondy.Object.CDisplayStyle[]} 描述地图文档显示样式的参数信息.
* @example
* VecLayer.getStyle()
*/
GdbpLayer.prototype.getStyle = function () {
return this.options.style !== undefined ? this.options.style : null;
}
/**
* Source for MapGIS servers
* 设置地图样式
*/
/**
* @function Zondy.Map.GdbpLayer.setStyle(opt_style)
* @description 设置地图文档显示样式参数信息。
* @param opt_style - {Zondy.Object.CDisplayStyle[]} 地图文档显示样式参数。
* @example
* VecLayer.setStyle(opt_style)
*/
GdbpLayer.prototype.setStyle = function (opt_style) {
if (opt_style !== undefined && opt_style !== null) {
this.style = opt_style;
assign(this.options, {'style': opt_style});
}
}
/**
* Source for MapGIS servers
* 设置地图文档图层显示，隐藏，追加和删除等情况
* opt_filters 用户指定的图层过滤条件，它由多个键值对组成，值为您所要设定的过滤条件。
* 以“，”分隔,
* 如：1:ID>4,3:ID>1
* 如：1:面积>920
* 如：1:name='中华人民共和国'
* 如：FIRST_FIRS='Asia'
*/
/**
* @function Zondy.Map.GdbpLayer.setFilters(opt_filters)
* @description 设置地图文档图层过滤条件。
* @param opt_filters - {String} 过滤条件。如：'1:ID>4,3:ID>1”。
过滤条件中用到的符号包括“==”、“!=”、“<”、“>”、“<=”、“>=”、“..”、“~”等，当包含中文条件时，请使用UTF-8编码格式，其中“：”和“，”为保留字符，用于表示键值对概念和分隔不同图层的条件，请不要将这2个字符用于自定义条件中，javascitpt中请使用encodeURI（）函数编码后再代入filters参数中。
* @example
//显示第0个图层，所有id大于1的数据
* var opt_style = '0:id>1';
* VecLayer.setFilters(opt_filters)
* VecLayer.refresh()
*/
GdbpLayer.prototype.setFilters = function (opt_filters) {
if (opt_filters != null && opt_filters.toString() != "") {
this.filters = opt_filters;
assign(this.options, {'filters': opt_filters});
}
};
export {GdbpLayer};
Zondy.Map.GdbpLayer = GdbpLayer;
