首页 / 浏览问题 / 三维GIS / 问题详情
用WebGL的方式调用场景后想要实现飞行功能
63EXP 2018年04月27日

调用场景后需要实现飞行功能,却一直无法实现,想问一下我的代码有没有问题

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title>庐山东林寺场景</title>
    <link href="css/widgets.css" rel="stylesheet">
    <script type="text/javascript" src="js/require.min.js" data-main="js/main"></script>
    <link href="Build/Cesium/Widgets/widgets.css" rel="stylesheet">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap-select.min.js"></script>


    <style>
        html, body, #cesiumContainer {
            width: 100%; height: 100%; margin: 0; padding: 0;float: right;overflow: hidden;
        }

        .tools{
            width: 20px;
            height: 20px;
            margin: 10px;
        }
        .tool{
            width: 60px;
            height: 30px;
        }
        
    </style>

    <style type="text/css">
        #header {
            background-color:#FF9900;
            color:black;
            text-align:center;
            padding:20px;
        }
        #left {
            width:16%;
            height: 100%;
            float: left;
            background-color: #eeeeee;     
        }
        #cesiumContainer {
            height: 100%;
            width: 84%;
            float: right;    
        }
    </style>
        
        
</head>
<body>
<div id="header"><h3 style="color: #5F9EA0;">庐山东林寺三维场景</h3></div>
<div id="cesiumContainer"></div>
<div id="left">
     <div id="toolbar" style="left : 0px; top : 5px;position: relative;width: 250px;height: 50px;float: left;">
         <p>飞行控制模块</p>
         <button id="play" class="tool" title="开始">开始</button>
         <button id="pause" class="tool" title="暂停">暂停</button>
         <button id="stop" class="tool" title="停止">停止</button>
    </div>
    <div style="width: 100px;position: relative;width: 40px;float: left;left:0px; margin-top: 50px;">
        <select id="stopList" >
            <!--<option disabled selected value>&#45;&#45;选择站点&#45;&#45;</option>-->
        </select>
    </div>
</div>
<script type="text/javascript">
        var viewer,url;
        url = "http://59.55.128.155:8090/iserver/services/3D-DLS/rest/realspace/datas/Config/config";
        function onload(Cesium) {
            viewer = new Cesium.Viewer('cesiumContainer');
            var scene = viewer.scene;
            var widget = viewer.cesiumWidget;
            var toolbar = document.getElementById('toolbar')
           try{
                 var promise = scene.addS3MTilesLayerByScp(url,{ name: 'DLS'});
                 
                 Cesium.when(promise).then(function(layer){
                      scene.camera.setView({  destination : Cesium.Cartesian3.fromDegrees(115.943022878770010,29.602493888870001,1000)});      
                      },function(e){
            if (widget._showRenderLoopErrors) {
                var title = 'An error occurred while rendering.  Rendering has stopped.';
                widget.showErrorPanel(title, undefined, e);
            }
        });
           }
        catch(e){
            if (widget._showRenderLoopErrors) {
                var title = 'An error occurred while rendering.  Rendering has stopped.';
                widget.showErrorPanel(title, undefined, e);
            }
        }

        var routes = new Cesium.RouteCollection();
        var fpfUrl ='./fpf/DLSflyroute.fpf';
        routes.fromFile(fpfUrl);                    
        //初始化飞行管理
        var flyManager = new Cesium.FlyManager(scene,routes);         
        $('#play').onclick(function(){
            flyManager && flyManager.play();
        });
        $('#pause').onclick(function(){
            flyManager && flyManager.pause();
        });
        $('#stop').onclick(function(){
            flyManager && flyManager.stop();    
        });
    }
    </script>
</body>
</html>

新手上车,希望能给出处理意见

1个回答

5,985EXP 2018年04月27日
...