本文主要是介绍Cesium禁止相机进入地下(地形穿透)问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
Cesium滚动鼠标的 禁止相机进入地下 亲测可行的解决方法
- 问题描述
- 解决方案
问题描述
Cesium的地形图中,滚动鼠标滚轮会出现Cesiumviewer进入地形之下,出现格网
如下图所示
在设置了 scene.screenSpaceCameraController.minimumZoomDistance=100;
之后,在地形还在加载的过程中旋转地球,依然会出现上述问题。
解决方案
注意:版本号1.47.0测试成功 其他1.XX版本相差不太大
先是会出现部分格网,但是会加载对应的视角的地形。之前是一直出现格网不会加载地形的。效果受电脑配置影响。
监控相机的pitch值
pitch>0的时候就禁止地球旋转事件
监控鼠标滚轮按下的鼠标移动事件
当鼠标朝下移的时候就允许地球旋转
具体代码
//初始化地球
var viewer = new Cesium.Viewer('cesiumContainer',{infoBox: false,selectionIndicator: false,shadows: true,shouldAnimate: true,animation: false, //动画控制不显示baseLayerPicker: false, //图层控制显示geocoder: false, //地名查找不显示timeline: false, //时间线不显示sceneModePicker: false, //投影方式显示sceen3DOnly: true,fullscreenButton: false,homeButton: false,navigationHelpButton: false,})
//相机的pitch值大于0则禁止球旋转操作
var scene = viewer.scene;
var canvas = viewer.canvas;
var camera = viewer.camera;
scene.screenSpaceCameraController.minimumZoomDistance=100; //距离地形的距离?这个值可以多测试几个值,,我这不太好描述
viewer.clock.onTick.addEventListener(function () {setMinCamera();
})
var setMinCamera = function () {if(camera.pitch > 0){scene.screenSpaceCameraController.enableTilt = false;}
}
//监控鼠标滚轮按下状态下移动鼠标事件,当鼠标向下移动的时候就允许地球旋转操作
var startMousePosition;var mousePosition;var handler = new Cesium.ScreenSpaceEventHandler(canvas);handler.setInputAction(function(movement) {mousePosition = startMousePosition = Cesium.Cartesian3.clone(movement.position);handler.setInputAction(function(movement) {mousePosition = movement.endPosition;var y = mousePosition.y - startMousePosition.y;if(y>0){scene.screenSpaceCameraController.enableTilt = true;}}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);}, Cesium.ScreenSpaceEventType.MIDDLE_DOWN);
至此相机操作不会再进入地下或者地形里面,个人发现和那个minimumZoomDistance=100有关系,不会出现格网,而是缓慢加载对应视角的地图情况。效果如下图所示:
地形加载过程中:
加载完成
如果没有解决地形格网,则格网将一直存在,解决后将加载对应视角的地形情况,如下图
这篇关于Cesium禁止相机进入地下(地形穿透)问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!