cesium常用设置【转】

https://blog.csdn.net/D_Walker/article/details/82188514

1.加载线上cesium代码
<link href="http://cesiumjs.org/releases/1.20/Build/Cesium/Widgets/widgets.css" rel="stylesheet"/>
<script src="http://cesiumjs.org/releases/1.20/Build/Cesium/Cesium.js"></script>

2.默认情况下所加载的GLTF模型朝向东方。但是我们可以通过Entity.orientation属性指定一个四元组来控制模型的方向

var viewer = new Cesium.Viewer('cesiumContainer');
var position = Cesium.Cartesian3.fromDegrees(-123.0744619, 44.0503706);
var heading = Cesium.Math.toRadians(45.0);
var pitch = Cesium.Math.toRadians(15.0);
var roll = Cesium.Math.toRadians(0.0);
var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, heading, pitch, roll);

var entity = viewer.entities.add({
    position : position,
    orientation : orientation,
    model : {
        uri : '../../SampleData/models/CesiumGround/Cesium_Ground.gltf'
    }
});
viewer.trackedEntity = entity;

3.禁用默认的事件处理程序

 var viewer = new Cesium.Viewer('cesiumContainer',{
            baseLayerPicker : false,
            imageryProvider : new Cesium.ArcGisMapServerImageryProvider({
            url :'http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer'
            })
        });
        var scene = viewer.scene;
        var ellipsoid = viewer.scene.globe.ellipsoid;  //获取地球球体对象

        //禁用默认的事件处理程序
        //如果为真,则允许用户旋转相机。如果为假,相机将锁定到当前标题。此标志仅适用于2D和3D
        scene.screenSpaceCameraController.enableRotate = false;
        //如果为真,则允许用户平移地图。如果为假,相机将保持锁定在当前位置。此标志仅适用于2D和Columbus视图模式
        scene.screenSpaceCameraController.enableTranslate = false;
        //如果为真,则允许用户放大和缩小。如果为假,相机将锁定到距离椭圆体的当前距离。
        scene.screenSpaceCameraController.enableZoom = false;
        //如果为真,则允许用户倾斜相机。如果为假,相机将锁定到当前标题。这个标志只适用于3D和哥伦布视图。
        scene.screenSpaceCameraController.enableTilt = false;
        //如果为真,则允许用户使用免费外观。如果为假,摄像机视图方向只能通过转换或旋转进行更改。此标志仅适用于3D和哥伦布视图模式。
        scene.screenSpaceCameraController.enableLook = false;

4.隐藏对应的实体模型

tileset.style = new Cesium.Cesium3DTileStyle({
            color: {
                conditions: [
                    ["${ID} === '528851'||${ID} === '554086'", "rgba(${red}, ${green}, ${blue}, 0)"],
                    ["true","rgba(${red}, ${green}, ${blue}, 1)"]
                ]
            }
        });

5.对cesium的帮组按钮内容进行汉化

function navigationHelpButtonLang() {
    var viewer = this.viewer;
    if (viewer.navigationHelpButton) {
        viewer.navigationHelpButton.viewModel.tooltip = "操作指南";

        var clickHelper = viewer.navigationHelpButton.container.getElementsByClassName("cesium-click-navigation-help")[0];
        var touchHelper = viewer.navigationHelpButton.container.getElementsByClassName("cesium-touch-navigation-help")[0];

        var button = viewer.navigationHelpButton.container.getElementsByClassName("cesium-navigation-button-right")[0]
        button.innerHTML = button.innerHTML.replace(">Touch", ">手势");
        button = viewer.navigationHelpButton.container.getElementsByClassName("cesium-navigation-button-left")[0]
        button.innerHTML = button.innerHTML.replace(">Mouse", ">鼠标");

        var click_help_pan = clickHelper.getElementsByClassName("cesium-navigation-help-pan")[0];
        click_help_pan.innerHTML = "平移";
        var click_help_pan_details = click_help_pan.parentNode.getElementsByClassName("cesium-navigation-help-details")[0];
        click_help_pan_details.innerHTML = "按下左键 + 拖动";

        var click_help_zoom = clickHelper.getElementsByClassName("cesium-navigation-help-zoom")[0];
        click_help_zoom.innerHTML = "旋转";
        click_help_zoom.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "按下右键+拖动";
        click_help_zoom.parentNode.getElementsByClassName("cesium-navigation-help-details")[1].innerHTML = "";

        var click_help_rotate = clickHelper.getElementsByClassName("cesium-navigation-help-rotate")[0];
        click_help_rotate.innerHTML = "缩放";
        click_help_rotate.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "滚动鼠标滚轮";
        click_help_rotate.parentNode.getElementsByClassName("cesium-navigation-help-details")[1].innerHTML = "";

        //触屏操作
        var touch_help_pan = touchHelper.getElementsByClassName("cesium-navigation-help-pan")[0];
        touch_help_pan.innerHTML = "平移";
        touch_help_pan.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "单指拖动";

        var touch_help_zoom = touchHelper.getElementsByClassName("cesium-navigation-help-zoom")[0];
        touch_help_zoom.innerHTML = "缩放";
        touch_help_zoom.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "双指捏合";

        var touch_help_tilt = touchHelper.getElementsByClassName("cesium-navigation-help-rotate")[0];
        touch_help_tilt.innerHTML = "俯仰";
        touch_help_tilt.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "双指同向拖动";

        var touch_help_rotate = touchHelper.getElementsByClassName("cesium-navigation-help-tilt")[0];
        touch_help_rotate.innerHTML = "旋转";
        touch_help_rotate.parentNode.getElementsByClassName("cesium-navigation-help-details")[0].innerHTML = "双指反向拖动";

    }

}

6.更改cesium默认的鼠标操作以及对调试工具的设置

  viewer.scene.screenSpaceCameraController.zoomEventTypes = [Cesium.CameraEventType.WHEEL, Cesium.CameraEventType.PINCH];
  viewer.scene.screenSpaceCameraController.tiltEventTypes = [Cesium.CameraEventType.PINCH, Cesium.CameraEventType.RIGHT_DRAG];
  var imageryProviderViewModels = viewer.baseLayerPicker.viewModel.imageryProviderViewModels;
    viewer.baseLayerPicker.viewModel.selectedImagery = imageryProviderViewModels[3];
    viewer.extend(Cesium.viewerCesiumInspectorMixin);
    viewer.cesiumInspector.container.style.display = "none";
    viewer.scene.debugShowFramesPerSecond = true;
    document.addEventListener('keydown', function (event) {
        var e = event || window.event || arguments.callee.caller.arguments[0];
        if (e) {
            switch (e.keyCode) {
                // case 82: //R键查看地形三角网
                //     if (viewer.cesiumInspector) {
                //         viewer.cesiumInspector.viewModel.wireframe = !viewer.cesiumInspector.viewModel.wireframe;
                //     }
                //     break;
                case 70: //F键查看帧率
                    viewer.scene.debugShowFramesPerSecond = !viewer.scene.debugShowFramesPerSecond;
                    break;
                default:
            }
        }
    });

7.手机加载或者pad加载时提高画质。

if(Cesium.FeatureDetection.supportsImageRenderingPixelated()){
    viewer.resolutionScale = window.devicePixelRatio;
}
原文链接:https://blog.csdn.net/D_Walker/article/details/82188514

posted on 2019-09-18 14:01  3D入魔  阅读(3239)  评论(0编辑  收藏  举报