• 三维地图如何加载gltf数据代码


    <!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="../Build/Cesium/Widgets/widgets.css" rel="stylesheet">
            <link href="./css/pretty.css" rel="stylesheet">
            <script src="./js/jquery.min.js"></script>
            <script src="./js/config.js"></script>
            <script src="./js/tooltip.js"></script>
            <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script>
        </head>
    
        <body>
            <div id="cesiumContainer"></div>
            <div id='loadingbar' class="spinner">
                <div class="spinner-container container1">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
                <div class="spinner-container container2">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
                <div class="spinner-container container3">
                    <div class="circle1"></div>
                    <div class="circle2"></div>
                    <div class="circle3"></div>
                    <div class="circle4"></div>
                </div>
            </div>
            <script type="text/javascript">
                function onload(Cesium) {
                    //初始化viewer部件
                    var viewer = new Cesium.Viewer('cesiumContainer');
                    var scene = viewer.scene;
                    var widget = viewer.cesiumWidget;
                    $('#loadingbar').remove();
                
    
                    //加载地块1建筑
                    var gltf1 = viewer.entities.add({
                        name: "gltf",
                        position: new Cesium.Cartesian3.fromDegrees(113.525727552426, 22.7664568396822, 0),
                        model: {
                            uri: "./data/MZW/mzw_01_bui.gltf"
                        }
                    }); 
               
                    var gltf2 = viewer.entities.add({
                        name: "gltf",
                        position: new Cesium.Cartesian3.fromDegrees(113.525727552426, 22.7664568396822, 0),
                        model: {
                            uri: "./data/MZW/mzw_01_flo_01.gltf"
                        }
                    });
                     
                  
                    var gltf3 = viewer.entities.add({
                        name: "gltf",
                        position: new Cesium.Cartesian3.fromDegrees(113.525727552426, 22.7664568396822, 0),
                        model: {
                            uri: "./data/MZW/mzw_01_flo_02.gltf"
                        }
                    });
                    
             
                    var gltf4 = viewer.entities.add({
                        name: "gltf",
                        position: new Cesium.Cartesian3.fromDegrees(113.525727552426, 22.7664568396822, 0),
                        model: {
                            uri: "./data/MZW/mzw_02_bui_01.gltf"
                        }
                    });
    
              
                    var gltf5 = viewer.entities.add({
                        name: "gltf",
                        position: new Cesium.Cartesian3.fromDegrees(113.525727552426, 22.7664568396822, 0),
                        model: {
                            uri: "./data/MZW/mzw_02_bui_02.gltf"
                        }
                    });
                     
                    viewer.zoomTo(gltf1);
                    viewer.zoomTo(gltf2);
                    viewer.zoomTo(gltf3);
                    viewer.zoomTo(gltf4);
                    viewer.zoomTo(gltf5);
                }
            </script>
        </body>
    
    </html>
  • 相关阅读:
    swiper获取当前的index ( loop=true时,)
    解决ios浏览器页面滚动到底部或顶部后,页面局部滑动失效的问题
    js实现全屏与退出全屏
    Ueditor 关于视频上传相关问题
    git拉取单个子目录
    XShell上传文件到Linux服务器上
    Debian中安装MySQL服务器
    lamda表达式的由来
    工具类--验证码工具类
    工具类--线程相关工具类
  • 原文地址:https://www.cnblogs.com/wanlige/p/12956595.html
Copyright © 2020-2023  润新知