Class: ArcGISMapImageLayer

ArcGISMapImageLayer

new ArcGISMapImageLayer(options)

document/layer/arcgis/ArcGISMapImageLayer.js, line 11

支持如下方法:
[1、加载图层资源]
[2、根据子图层id查询子图层]
[3、刷新图层]
[4、根据范围和大小获取image标签]
[6、根据参数获取图片的url]
[7、更新子图层]
[8、通过传入的json构造并返回一个新的几何对象]
9、导出为json对象
10、克隆几何对象

ArcGIS地图图片图层,
目前二维上支持4326(包括4490,4214以及4610),3857以及EPSG支持的自定义坐标系,三维上仅支持4326(包括4490,4214以及4610)以及3857坐标系,会自动读取元信息上的坐标系,不需要用户指定

[ES5引入方式]:
zondy.layer.ArcGISMapImageLayer()
[ES6引入方式]:
import { ArcGISMapImageLayer } from "@mapgis/webclient-common"

针对图层的操作请在图层加载完毕事件中进行
Layer.on('layerview-created', function (result) {
console.log("加载完毕:", result.layer)
});
如果不想在该事件中放入业务代码,则请确认图层资源已加载完毕后再进行操作
if(layer.loadStatus === 'loaded') {
// 你的业务逻辑
}

Name Type Description
options Object

构造参数

Name Type Description
url String 可选

服务基地址,
IGS发布的ArcGIS服务: http://{ip}:{port}/igs/rest/services/{folder}/{serviceName}/arcgis/MapServer
ArcGIS: https://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer
参考示例:[ArcGIS的地图图片图层示例]
删除图层方法:[删除图层]

Fires
Examples

ArcGIS的地图图片图层示例

// 初始化图层管理容器
// ES5引入方式
const { ArcGISMapImageLayer } = zondy.layer
// ES6引入方式
import { ArcGISMapImageLayer } from "@mapgis/webclient-common"
// 添加图层
const arcGISMapImageLayer = new ArcGISMapImageLayer({
  // 服务基地址
  url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer'
});

指定图层的坐标系示例

// ES5引入方式
const { ArcGISMapImageLayer } = zondy.layer
const { SpatialReference } = zondy
// ES6引入方式
import { ArcGISMapImageLayer,SpatialReference } from "@mapgis/webclient-common"
// 添加图层
const arcGISMapImageLayer = new ArcGISMapImageLayer({
  // 服务基地址
  url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer',
  // 自定义坐标新
  spatialReference: new SpatialReference({
    // 指定的wkid号,可在https://epsg.io/网站查询
    wkid: '指定的wkid号'
  })
});

地图图层示例 - 设置图片大小

// ES5引入方式
const { ArcGISMapImageLayer } = zondy.layer
// ES6引入方式
import { ArcGISMapImageLayer } from "@mapgis/webclient-common"
// 添加图层
const arcGISMapImageLayer = new ArcGISMapImageLayer({
  // 服务基地址
  url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer',
  // 瓦片宽度
  imageWidth: 512,
  // 瓦片高度
  imageHeight: 512
});

设置图层透明度

// ES5引入方式
const { ArcGISMapImageLayer } = zondy.layer
// ES6引入方式
import { ArcGISMapImageLayer } from "@mapgis/webclient-common"
// 初始化时设置
const arcGISMapImageLayer = new ArcGISMapImageLayer({
  // 服务基地址
  url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer',
  // 设置透明度
  opacity: 1.0
});

// 加载完成后设置
arcGISMapImageLayer.on('layerview-created', function (result) {
  console.log("加载完毕:", result.layer)
  // 视点跳转
  ArcGISMapImageLayer.opacity = 0.5
})

显示或隐藏图层

 // ES5引入方式
const { ArcGISMapImageLayer } = zondy.layer
// ES6引入方式
import { ArcGISMapImageLayer } from "@mapgis/webclient-common"
// 初始化时设置
const arcGISMapImageLayer = new ArcGISMapImageLayer({
  // 服务基地址
  url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer',
  // 显示或隐藏图层
  visible: true
});

// 加载完成后设置
arcGISMapImageLayer.on('layerview-created', function (result) {
  console.log("加载完毕:", result.layer)
  // 显示或隐藏图层
  arcGISMapImageLayer.visible = !ArcGISMapImageLayer.visible
})

删除图层

map.remove(arcGISMapImageLayer)

图层顺序

// 加载完毕后,更改图层顺序
map.reorder(arcGISMapImageLayer, '要移动到的index');

Extends

Members

allSublayersCollection

所有子图层对象信息

descriptionString

图层描述信息

documentInfoObject

地图文档信息

dynamicProjectionEnabledBoolean

是否开启动态投影

imageFormatString

图片格式

imageFormatsArray

图片格式数组,表示服务支持的所有图片格式

imageHeightNumber

瓦片化显示时,瓦片高度

imageTransparencyBoolean

图片中没有数据的地方是否透明

imageWidthNumber

瓦片化显示时,瓦片宽度

mapNameString

地图名称

sublayersCollection null Object

所有子图层对象信息

typeString

图层类型

urlString

服务基地址

versionString

服务的版本

Methods

ArcGISMapImageLayer.fromJSON(json){ArcGISMapImageLayer}

document/layer/arcgis/ArcGISMapImageLayer.js, line 592

通过传入的json构造并返回一个新的几何对象

Name Type Description
json Object 可选

JSON对象

Returns:
Type Description
ArcGISMapImageLayer 新的ArcGISMapImageLayer对象
Example

通过传入的json构造并返回一个新的几何对象

 // ES5引入方式
const { ArcGISMapImageLayer } = zondy.layer
// ES6引入方式
import { ArcGISMapImageLayer } from "@mapgis/webclient-common"
const json = {
  // 服务基地址
  url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer',
}
const arcGISMapImageLayer = new ArcGISMapImageLayer.fromJSON(json)

_createSublayerOptions(serverSublayerInfo, clientSublayerInfo, options){*}

document/layer/arcgis/ArcGISMapImageLayer.js, line 507

创建子图层sublayers

Name Type Description
serverSublayerInfo *
clientSublayerInfo *
options *
Returns:
Type Description
*

clone(){ArcGISMapImageLayer}

document/layer/arcgis/ArcGISMapImageLayer.js, line 611

克隆方法

Returns:
Type Description
ArcGISMapImageLayer 图层

fetchImage(extent, width, height){Promise}

document/layer/arcgis/ArcGISMapImageLayer.js, line 434

根据范围和大小获取image标签

Name Type Default Description
extent Extent

范围参数

width Number 256 可选

图片宽度,单位px

height Number 256 可选

图片高度,单位px

Returns:
Type Description
Promise 请求完毕后的回调
Example

根据范围和大小获取image标签

 // ES5引入方式
const { Extent } = zondy.geometry
// ES6引入方式
import { Extent } from "@mapgis/webclient-common"
arcGISMapImageLayer.fetchImage({
  // 你的范围
  extent: new Extent(),
  // 图片宽度
  width: 256,
  // 图片高度
  height: 256
}).then((image) => {
  // 这里返回一个html的image标签
})

findSublayerById(id){Object}

document/layer/arcgis/ArcGISMapImageLayer.js, line 402

根据子图层id查询子图层

Name Type Description
id String

子图层id

Returns:
Type Description
Object 子图层信息

getImageUrl(options){String}

document/layer/arcgis/ArcGISMapImageLayer.js, line 573

根据参数获取图片的url

Name Type Description
options
Name Type Description
extent Extent 可选

图片范围

width Number 可选

图片宽度

height Number 可选

图片高度

Returns:
Type Description
String 图片的url
Example

根据参数获取图片的url

 // ES5引入方式
const { Extent } = zondy.geometry
// ES6引入方式
import { Extent } from "@mapgis/webclient-common"
const url = arcGISMapImageLayer.getImageUrl({
  // 你的范围
  extent: new Extent(),
  // 图片宽度
  width: 256,
  // 图片高度
  height: 256
})

toJSON(){Object}

document/layer/arcgis/ArcGISMapImageLayer.js, line 601

转换为json对象

Returns:
Type Description
Object json对象