首页 / 浏览问题 / WebGIS / 问题详情
webgl二维模式清除dataSource问题
22EXP 2021年07月30日

viewer.dataSources.removeAll()在二维场景下无法清除会报错

请问这有解决办法吗?

1个回答

您好,我这边测试了一下,不论是2D还是2.5D模式下, viewer.dataSources.removeAll() 都是没有问题的,您可以把下面的代码粘贴到官网示例里面去运行

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta http-equiv="pragma" content="no-cache">
    <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/bootstrap.min.css" rel="stylesheet">
    <link href="./css/pretty.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>
    <script type="text/javascript" src="http://www.supermapol.com/earth/Build/Cesium/Cesium.js"></script>
    <script src="./js/config.js"></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>
<div id="toolbar" style="position: absolute;left: 5px;top: 5px;display: none;">
    <select id="imageryOptions" class="selectpicker show-tick form-control">
        <!--<option disabled selected value>&#45;&#45;选择服务类型&#45;&#45;</option>-->
        <option selected value="WGS">自定义影像&地形-平面场景</option>
        <option value="MEC">倾斜数据-三维场景</option>
    </select>
    <button id='tt'>清除</button>
</div>
<script>
    function onload(Cesium) {
        //初始化viewer部件
        var viewer = new Cesium.Viewer('cesiumContainer', {
            terrainProvider: new Cesium.CesiumTerrainProvider({
                url: URL_CONFIG.ZF_TERRAIN,
                isSct: true//地形服务源自SuperMap iServer发布时需设置isSct为true
            }),
            sceneModePicker: true,
            navigation: false,
        });
        var layer = viewer.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
            url: URL_CONFIG.ZF_IMG
        }));

        viewer.scene.camera.setView({
            destination: new Cesium.Cartesian3(-1226925.7054612704, 5354675.979312425, 3270577.600069679),
            orientation: {
                heading: 6.109613004885443,
                pitch: -0.48783918611301136,
                roll: 6.283185307179586
            }
        });
        
        var scene = viewer.scene;
        var promise = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_JINJIANG);

viewer.scene.mode = Cesium.SceneMode.SCENE2D;//平面场景



//加载线数据
        var roadLine1 = Cesium.GeoJsonDataSource.load('./data/json/lineback_1.json');
        roadLine1.then(function (dataSource) {
            viewer.dataSources.add(dataSource);
            var lines_1 = dataSource.entities.values;
            for (var i = 0; i < lines_1.length; i++) {
                var line = lines_1[i];
                line.polyline.material = new Cesium.PolylineGlowMaterialProperty({ //设置Glow材质
                    glowPower: 0.005,
                    color: new Cesium.Color(8, 5, 0, 0.3)
                });
                line.polyline.width = 6;
            }

        }).otherwise(function (error) {
            window.alert(error);
        });


$('#tt').click(function(){
    viewer.dataSources.removeAll();
    console.log(1111111)
})

        //添加下拉菜单,点击选项切换地图服务
        $('#imageryOptions').change(function () {
            var value = $(this).val();
            if (value == 'WGS') {
                viewer.scene.camera.setView({
                    destination: new Cesium.Cartesian3(-1226925.7054612704, 5354675.979312425, 3270577.600069679),
                    orientation: {
                        heading: 6.109613004885443,
                        pitch: -0.48783918611301136,
                        roll: 6.283185307179586
                    }
                });
                viewer.scene.mode = Cesium.SceneMode.SCENE2D;//平面场景
//平面场景
            }
            else if (value == 'MEC') {
                Cesium.when(promise, function (layers) {
                    viewer.scene.mode = Cesium.SceneMode.SCENE3D;//三维场景
                    //设置相机位置,定位至模型
                    scene.camera.setView({
                        //将经度、纬度、高度的坐标转换为笛卡尔坐标
                        destination: Cesium.Cartesian3.fromDegrees(118.54909017414182, 24.80259473610606, 105.40531821331771),
                        orientation: {
                            heading: 5.154573786584606,
                            pitch: -0.14229615865957967,
                            roll: 3.2294167340296553e-12
                        }
                    });
                });
            }
        });
        $('#toolbar').show();
        $('#loadingbar').remove();


    }
    if (typeof Cesium !== 'undefined') {
        window.startupCalled = true;
        onload(Cesium);
    }
</script>
</body>
</html>

6,087EXP 2021年07月30日
我试了一下发现是cesium.js引用不一样,我用的是下载的webgl包里面的,和在线的这个是不一样吗?
重新下载一个,可能是版本的问题
好的 谢谢
...