- 需求背景
- 解决效果
- getFeatureInfo
需求背景
在用 geoserver 渲染图层时,会自动触发 GetFeatureInfo ,与服务器通信,在万级海量数据
渲染下,这个性能消耗就可以感受到了
需要考虑的点:
1.通过enablePickFeatures
,关闭cesium自身调用geoserver服务 (开始的10多秒 -> 毫秒级别
)
2.需要对照cesium源码,模拟pickImageryLayerFeatures拾取wms服务图层模拟,实现pickFeatures
条用服务方法
解决效果
getFeatureInfo
const getFeatureInfo = async (movement) => {
console.time('点击时间')
const screenPosition = movement.position;
const ray = viewer.camera.getPickRay(screenPosition);
const terrainIntersection = viewer.scene.globe.pick(ray, viewer.scene);
const cartographic = Cesium.Cartographic.fromCartesian(terrainIntersection);
const longitude = Cesium.Math.toDegrees(cartographic.longitude); // 经度
const latitude = Cesium.Math.toDegrees(cartographic.latitude); // 纬度
const pickedTile = viewer.scene.globe._surface._tilesToRender
const level = pickedTile[0].data.imagery[0].readyImagery.level
const offset = 265 - 15 * level
const deltaLat = offset / 111320;
const deltaLon = offset / 111320;
const maxx = Math.max.apply(null,[longitude - deltaLon,longitude + deltaLon])
const minx = Math.min.apply(null,[longitude - deltaLon,longitude + deltaLon])
const maxy = Math.max.apply(null,[ latitude - deltaLat,latitude + deltaLat])
const miny = Math.min.apply(null,[ latitude - deltaLat,latitude + deltaLat])
const bbox = [minx, miny, maxx, maxy].join()
const allTypeNameArr = ['zhsw:basic_waterwork', "zhsw:basic_pipeline", "zhsw:basic_pump", "zhsw:basic_node", "zhsw:basic_valve", "zhsw:basic_reservoir"]
const typeNameArr = viewer.imageryLayers._layers.map(item => item.imageryProvider.layers).reverse().filter(item => allTypeNameArr.includes(item))
const promiseArr = typeNameArr.map(typeName => wfsGetFeaturei({
service: 'WFS',
version: '1.0.0',
request: 'GetFeature',
outputFormat: 'application/json',
srs: 'EPSG:4326',
maxFeatures: 5,
typeName,
x: 128,
y: 128,
width: 256,
height: 256,
bbox,
viewparams:`planId:${globalStore.planObj.id};regionId:${globalStore.planObj.regionId}`,
}))
const dataArr = await Promise.all(promiseArr)
let data = []
dataArr.some(item => {
data = item.data.features
return item.data.features.length
})
return data
console.timeEnd('点击时间')
}