cesium-study
/
09.点击home按钮.html

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Use correct character set. -->
    <meta charset="utf-8" />
    <!-- Tell IE to use the latest, best version. -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <title>Hello World!</title>
    <script src="Build/Cesium/Cesium.js"></script>
    <style>
        @import url(Build/Cesium/Widgets/widgets.css);

        html,
        body,
        #cesiumContainer {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
    </style>
</head>
<body>
    <div id="cesiumContainer"></div>
    <script>

        //创建一个基本地球
        viewer = new Cesium.Viewer("cesiumContainer", {
            imageryProvider: new Cesium.OpenStreetMapImageryProvider({
                url: 'https://a.tile.openstreetmap.org/'
            }),
            animation: false, //动画控制，默认true （图中1）
            baseLayerPicker: false,//地图切换控件(底图以及地形图)是否显示,默认显示true  （图中6）
            fullscreenButton: true,//全屏按钮,默认显示true  （图中4）
            geocoder: false,//地名查找,默认true  （图中9）
            timeline: false,//时间线,默认true  （图中3）
            vrButton: false,//双屏模式,默认不显示false
            homeButton: true,//主页按钮，默认true  （图中8）
            infoBox: false,//点击要素之后显示的信息,默认true
            selectionIndicator: true//选中元素显示,默认true
        });
        viewer.cesiumWidget.creditContainer.style.display = "none";//去cesium logo水印

        //点击home按钮
        if (viewer.homeButton) {
            viewer.homeButton.viewModel.command.beforeExecute.addEventListener(function (commandInfo) {
                centerAtHome();
                commandInfo.cancel = true;
            });
        }

        function centerAtHome() {
            var centeropt = { "x": 106.627404, "y": 26.755607, "z": 30499.4, "heading": 356.3, "pitch": -70, "roll": 360 };
            //相机的一个定位操作
            viewer.camera.flyTo({
                destination: Cesium.Cartesian3.fromDegrees(centeropt.x, centeropt.y, centeropt.z || 0), //经度、纬度、高度
                orientation: {
                    heading: Cesium.Math.toRadians(centeropt.heading || 0),                          //绕垂直于地心的轴旋转
                    pitch: Cesium.Math.toRadians(centeropt.pitch || -Cesium.Math.PI_OVER_FOUR),      //绕纬度线旋转
                    roll: Cesium.Math.toRadians(centeropt.roll || 0)                                 //绕经度线旋转
                },
                duration: 3,
            });
        }


    </script>
</body>
</html>