Cesium初始化配置和鼠标左键旋转右键拖拽事件

1，Cesium 的初始化配置

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49

var viewer = new Cesium.Viewer('cesiumContainer', {        animation: false, // 动画部件        baseLayerPicker: false, // 基础图层部件        fullscreenButton: false, // 全屏按钮部件        vrButton: false, // vr部件        geocoder: false, // 位置搜索部件        homeButton: false, // home按钮        infoBox: false, // 消息框部件        sceneModePicker: false, // 二三维切换部件        selectionIndicator: false,        timeline: false, // 时间轴部件        navigationHelpButton: false, // 导航帮助按钮        navigationInstructionsInitiallyVisible: false, // 导航说明显示        scene3DOnly: true, // 当设置为true时，每个几何图形实例将仅以3D形式呈现，以节省GPU内存。        shouldAnimate: false, // 太阳模拟时钟时间        // clockViewModel: new Cesium.ClockViewModel(clock),  // 当shouldAnimate为ture,执行当前设置的时间区间动画        // selectedImageryProviderViewModel:{}, // 当前基础影像图层，如果设置将使用第一个可用的基础图层。仅当“ baseLayerPicker”设置为true时，此值才有效。        // imageryProviderViewModels: [],  //可以从BaseLayerPicker中选择的ProviderViewModels数组。仅当“ baseLayerPicker”设置为true时，此值才有效。        // selectedTerrainProviderViewModel: new Cesium.ProviderViewModel(options) // 当前基础地形图层的视图模型（如果未提供）将使用第一个可用的基础图层。仅当“ baseLayerPicker”设置为true时，此值才有效。        // terrainProviderViewModels: [],   // 可以从BaseLayerPicker中选择的ProviderViewModels数组。仅当“ baseLayerPicker”设置为true时，此值才有效。        // imageryProvider: // 加载不同的地图服务。仅当“ baseLayerPicker”设置为false时，此值才有效。        // terrainProvider: // 加载地形服务        // skyBox: false,  // 配置天空盒子或不显示天空盒子        // skyAtmosphere: false, // 配置大气或不显示大气        // fullscreenElement: '',  // 配置全屏按钮，传入id或者dom        useDefaultRenderLoop: true, // 控制是否继续渲染        // targetFrameRate:24, // 控制渲染帧数        showRenderLoopErrors: true, // 报错是否弹出错误        useBrowserRecommendedResolution: true, // 设置为false使用window.devicePixelRatio属性        automaticallyTrackDataSourceClocks: false, // 设置成true，使用公共clock对象，设置false，所有功能使用独立clock对象        contextOptions: {}, // 创建场景时，配置webgl        sceneMode: Cesium.SceneMode.SCENE3D, // 初始化场景为3D、2.5D、2D        // mapProjection:new GeographicProjection(),   // 使用2D 或者 Columbus View modes 设置地图投影方式        //globe: false, // 配置新的地球或隐藏地球        orderIndependentTranslucency: true, // 如果为true且配置支持，则使用顺序无关的透明性。        creditContainer: document.getElementById('units'),    // 部件容器        // creditViewport: '', // 提示显示容器        // dataSources: new Cesium.DataSourceCollection(), // 小部件数据源设置        terrainExaggeration: 1.0,   // 夸大地形        shadows: true,  // 是否打开阴影        terrainShadows: true,   // 是否打开地形阴影        mapMode2D: Cesium.MapMode2D.INFINITE_SCROLL,   // 设置2D地图水平旋转        projectionPicker: false,    // 设置为true,  ProjectionPicker部件会被创建,    ProjectionPicker：设置地球最佳视角        // 如果为真，渲染帧只会在需要时发生，这是由场景中的变化决定的。启用可以减少你的应用程序的CPU/GPU使用，并且在移动设备上使用更少的电池，但是需要使用Scene#requestRender在这种模式下显式地渲染一个新帧。在许多情况下，在API的其他部分更改场景后，这是必要的。请参阅使用显式呈现提高性能。        // 不是特别明白，应该是提高渲染性能的        requestRenderMode: true,        // 如果requestRenderMode为true，这个值定义了在请求渲染之前允许的模拟时间的最大变化。请参阅使用显式呈现提高性能。        maximumRenderTimeChange: 0.0    });

     　　　　 viewer.scene.requestRenderMode = true;

     　　　　 viewer.scene.moon.show = false;

     　　　　 viewer.scene.fog.enabled = false;

     　　　　 viewer.scene.sun.show = false;

     　　　　 viewer.scene.skyBox.show = false;

     　　　　 viewer.cesiumWidget.creditContainer.style.display = "none"; //去水印

 

                    //解决Cesium绘制几何图形被高程遮挡问题

      　　　　viewer.scene.globe.depthTestAgainstTerrain = true;

　　2.鼠标事件调整

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

//关闭双击事件   viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(     Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK   );   // 倾斜视图 鼠标左键旋转   viewer.scene.screenSpaceCameraController.tiltEventTypes = [     Cesium.CameraEventType.LEFT_DRAG,   ];   // 缩放设置 重新设置缩放成员   viewer.scene.screenSpaceCameraController.zoomEventTypes = [     Cesium.CameraEventType.MIDDLE_DRAG,     Cesium.CameraEventType.WHEEL,     Cesium.CameraEventType.PINCH,   ];   // 平移 添加鼠标右键  鼠标右键平移   viewer.scene.screenSpaceCameraController.rotateEventTypes = [     Cesium.CameraEventType.RIGHT_DRAG,   ];

　　3.鼠标事件监听

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29

// 左键监听 hander.setInputAction((movement) => {   var pick = viewer.scene.pickPosition(movement.position);   var pickModel = viewer.scene.pick(movement.position);   var height = "";   var lat = "";   var lng = "";   if (pick) {     height = Cesium.Cartographic.fromCartesian(pick).height;     lat = Cesium.Math.toDegrees(       Cesium.Cartographic.fromCartesian(pick).latitude     );     lng = Cesium.Math.toDegrees(       Cesium.Cartographic.fromCartesian(pick).longitude     );     console.log(lng, lat, height, pick);   }   }, Cesium.ScreenSpaceEventType.LEFT_CLICK);       // 移动监听 hander.setInputAction((movement) => {   }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);   // 右键监听 hander.setInputAction((movement) => {   }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);