漂移现象如下
什么是图标漂移?
随着视野改变,图标相对于地面发生了相对位置的变化
让人感觉到图标有飘忽不定的感觉
原因分析
图标是静止的,它的位置在世界坐标系中是绝对的、静止的。
漂移大部分的原因是:
透视关系发生了错乱,本该被遮挡的物体,现在却被看到了
当前环境
1、Cesium.js版本为1.110
2、环境中加载了地形
let worldTerrain = await Cesium.createWorldTerrainAsync();
viewer.scene.terrainProvider = worldTerrain;
解决方案
下述2个必须同时设置才会起作用!
1、打开全局的深度检测
viewer.scene.globe.depthTestAgainstTerrain = true;
这个属性默认是false,也就是说,默认情况下,图标不会被地形遮挡!!
2、把billboard的深度检测保持一直打开
const position = new Cesium.Cartesian3(-1371108.6511167218,-5508684.080096612,2901825.449865087
);
viewer.entities.add({position: position,billboard: {image: "../images/Cesium_Logo_overlay.png",disableDepthTestDistance: 0,//默认值就是0,不用特意设置},
});
存在问题
按照上述解决方案,会存在下述问题:
1、图标会出现“部分”被地形遮挡的问题
2、图标通过heightReference方式贴地的时候,存在问题:
图标刚被完全遮挡的时候,图标依然可见
const position = new Cesium.Cartesian3(-1371108.6511167218,-5508684.080096612,2901825.449865087
);
viewer.entities.add({position: position,billboard: {image: "../images/Cesium_Logo_overlay.png",disableDepthTestDistance: 0,heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,//使用这个属性,会导致某些时刻,地形遮挡结果错误},
});
参考链接
cesium官方的一个blog
和本文关系不大,但是可以帮助深入了解billboard的设计
Billboards and Labels on Terrain Improvements – Cesium