# 图层
# 图层信息
# 查询图层要素
API参考
描述:
该接口用于查询要素图层(包括接口图层、要素图层、GeoJSON 图层、WFS 图层)中所包含的要素,通过一定的查询条件,返回符合该条件的查询结果。
定义:
/**
* 查询图层要素
* @param {string} layerName 查询图层名
* @param {(string|Object)} queryCondition 查询字段名/查询字段组合对象
* @param {(string|number)} value 查询字段值
**/
function queryGraphicsLayer(layerName, queryCondition, value, callback) {
}
示例:
1: 单字段查询
queryGraphicsLayer('layer1', 'pointCode', '001', function(graphics){
//graphics为查询结果,格式为数组。
})
2:多字段查询
queryGraphicsLayer('layer1', {
codeControlLevel: 1,
codeWaterLevel: 2
}, null, function(graphics){
//graphics为查询结果,格式为数组。
})
注:单字段查询也可以使用多字段查询的方式进行
# 图层弹窗
API参考
描述:
该接口用于显示图层要素信息的弹窗,该弹窗是一个已经写好的 HTML 页面。
在注册了图层事件之后,可在该事件中调用显示弹窗接口。注册图层事件接口参见:注册图层事件 (opens new window)
定义:
/**
* 查询图层要素
* @param {string} title 弹窗标题
* @param {string} content 弹窗内容
* @param {number} longitude 弹窗显示位置:经度
* @param {number} latitude 弹窗显示位置:纬度
* @param {Object} options 弹窗设置
* @example options = {
wkid: 4326 空间参考
width: 500 弹窗宽度
height: 215 弹窗高度
idadjust: true 是否自动调节(弹窗大小超过屏幕时,自动调节至能显示完整弹窗的位置)
offsetX: 0 横向偏移量
offsetY: 0 纵向偏移量
}
**/
function showInfoWindow(title, content, longitude, latitude, options) {
}
示例:
showInfoWindow('', '<iframe src="../html/popup/risk-source-popup.html" style="width: 100%;
height: 100px;"></iframe>', 98, 23, options)
注:一般来说该接口传入的弹窗均为已经写好的 HTML 页面,在这种情况下 title 参数传空。title 参数仅在 content 不为 iframe 时(这时的弹窗为系统自带样式,一般无法满足可视化需求),并且需要显示标题时才会添加。
# 图层操作
# 图层显隐
API参考
描述:
该接口用于修改图层的显隐状态。
定义:
事件订阅处
/**
* 查询图层要素
* @param {string} layerName 图层名称
* @param {bool} visible 图层显隐(true/false)
*/
subscribeEvent('change-layer-visibility', function(data) {
```data.layerName
data.visible```
})
示例:
publishEvent('change-layer-visibility', {
layers: [{
layerName: '城市浓度', // 图层名称
visible: true // 显隐性
}],
otherLayers: false // 其他图层的可见性 (可选,不配置,不修改其他图层的显隐性)
});
# 图层数据更新
API参考
描述:
该接口用于更新图层数据,包括接口图层、关联接口的 GeoJSON 图层。
定义:
事件订阅处
/**
* 查询图层要素
* @param {string} layerName 图层名称
* @param {Object} params 要更新的图层接口字段
*/
subscribeEvent('update-layer', function(data) {
```data.name
data.params
data.visible```
})
示例:
publishEvent('update-layer', [{
name: 'layer1', // 图层名称
params: {
monitorTime: '2020-03-06 10:00:00' // key为该图层接口地址中配置的可变参数,value为新值
controlLevels: 2,
},
visible: true // 更新完后该图层的显隐性
}]);
注:params 中的参数字段需要该图层在图层列表配置中也添加相同的字段,对应地图可视化配置平台中的添加参数字段功能,配置步骤如下图
# 图层渲染修改
API参考
描述:
该接口用于修改图层渲染信息,包括接口图层、要素图层、GeoJSON 图层、WFS 图层均可使用该接口。
定义:
事件订阅处
/**
* 查询图层要素
* @param {string} layerName 图层名称
* @param {Object} renderer 新的图层渲染信息
*/
subscribeEvent('change-layer-renderer', function(data) {
```data.layerName
data.renderer```
}
示例:
publishEvent('change-layer-renderer', {
layerName: 'layer1',
renderer: renderer
})
注 1:具体 renderer 结构参见:图层渲染 (opens new window)(渲染节点下的所有示例)
注 2:更新 Echarts 图层的渲染信息时,需要传入包含 renderType、option 和 rendererInfo 节点的完整渲染信息。其余图层则只需传入 renderInfo 节点下的数据即可
# 图层列表更新
API参考
描述:
该接口用于更新整个图层列表,之前的图层将会被全部移除。
定义:
事件订阅处
/**
* 查询图层要素
* @param {Object} config 新的图层列表配置内容
*/
subscribeEvent('update-layers', config)
示例:
publishEvent('update-layers', {
"layers": [
"name": "地表水",
"visible": true,
"children": [
{
```
```
}
]
]
})
注 1:完整图层列表配置内容参见:图层列表配置内容 (opens new window)
注 2:完整图层列表配置文件也可通过地图可视化配置平台配置
# 定位
# 定位至图层要素
API参考
描述:
该接口用于定位至符合某个查询条件的要素附近,包括接口图层、GeoJSON 图层、要素图层和 WFS 图层。
定义:
/**
* 查询图层要素
* @param {string} layerName 图层名称
* @param {(Object|string)} queryCondition 查询字段名/查询字段组合对象
* @param {(string|number)} value 查询字段值
* @param {number} factor 定位范围扩大倍数
* (默认为1.5,即定位范围为查询结果要素范围的1.5倍)
* @param {requestCallback} callback 查询结果的回调函数,返回查询到的要素集合
*/
function zoomToGraphicsLayer(layerName, queryCondition, value, factor, callback) {
}
示例:
zoomToGraphicsLayer('layer1', 'pointCode', '001', 1.5, function(graphics){
console.log(graphics);
})
zoomToGraphicsLayer('layer1', {
controlLevels: 1,
codeWaterLevel: 2
}, null, 1.5, function(graphics){
console.log(graphics);
})
注:单字段查询也可以使用多字段查询的方式进行
# 定位至要素
API参考
描述:
该接口用于定位要素附近,该要素可以是图层查询结果,也可以是注册图层事件获取的要素结果,包括接口图层、GeoJSON 图层、要素图层和 WFS 图层。
定义:
/**
* 查询图层要素
* @param {Graphic[]} graphics 要素集合(数组)
* @param {number} factor 定位范围扩大倍数(默认为1.5,即定位范围为查询结果要素范围的1.5倍)
*/
function zoomToGraphics(graphics, factor) {
}
示例:
zoomToGraphics(graphics, 1.5)
# 定位至经纬度(范围)
描述:
该接口用于定位某个经纬度或范围附近。
定义:
/**
* 查询图层要素
* @param {(Array|Object)} extent 定位的经纬度数组或者范围对象
* @param {number} wkid 空间参考(默认为4326)
*/
function zoomToExtent(extent, wkid) {
}
示例:
1.定位至范围
zoomToExtent({
xmin: 113
ymin: 23
xmax: 114
ymax: 24,
expandFactor: 1.5
}, 4490)
注:其中 xmin 为定位范围的最小经度,ymin为最小纬度,xmax为最大经度,ymax为最大纬度,expandFactor 为范围扩展系数(默认为 1.5,即定位范围为输入范围的 1.5倍)
2.定位至经纬度
zoomToExtent([113, 23, 0.1], 4326)
注:其中第一个参数为数组,其中依次为经度、纬度、范围扩展系数
# 其他
# 点位波纹效果
描述:
该接口用于生成某个点位的选中波纹效果图层,该图层实质是一个HTML图层,移除时调用removeCustomLayer( layerName )接口即可。
定义:
/**
* 查询图层要素
* @param {string} layerName 选中波纹效果的图层名称
* @param {(Graphic|Object)} graphic 空间参考(默认为4326)
* @param {sting} colorIn 波纹圈内的颜色(rgba(255,0,0,0)或者16进制颜色)
* @param {sting} colorOut 波纹圈外的颜色(rgba(255,0,0,0)或者16进制颜色)
* @param {number} width 波纹整体宽度
* @param {number} height 波纹整体高度
* @param {Object} options 空间参考(默认为4326)
* @param {boolean} isVisible 是否显示(默认为true)
*/
function showPointRipplePoint(layerName, graphic, colorIn, colorOut, width, height, options, isVisible) {
}
示例:
1.可以获取到graphic要素
showPointRipplePoint('layer1', graphic, null, null, 40, 40, {
pointerEvent: 'none',
zindex: 2
})
注:其中 graphic 可以是图层查询结果,也可以是注册图层事件获取的要素结果
2.可以获取到该位置的经纬度
showPointRipplePoint('layer1', {
geometry: {
x: 113,
y: 23
}
}, null, null, 40, 40, {
pointerEvent: 'none',
zindex: 2
})
注 1:其中第二个参数下的 geometry 中的 x 和 y 分别为经度和纬度
注 2:其中 pointerEvent: 'none' 表示波纹效果不会影响其它图层的鼠标事件。zindex 表示该图层的 DOM 层级
← 应用下载部署