Cesium加载三维点云数据_cesiumlab发布点云数据失败

作者：我家小花儿 | 2024-03-11 20:23:57

踩

cesiumlab发布点云数据失败

点云预处理

	点云数据的常见格式有ply，las,txt等格式，而Cesium不能直接加载，所以需要前期的数据处理，将点云数据处理成能够加载的类型
1

CloudCompare处理点云

在这里插入图片描述把现有的ply格式转为Cesiumlab可以处理的las格式

Cesiumlab切片

在这里插入图片描述

可以选择经纬度局部坐标系（不知道为什么选择wgs84(epgs4326),最后加载的样子有错误），此处的坐标在预览中作为指定位置

Cesium加载

<!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>
    <link rel="stylesheet" type="text/css" href="./Build/Cesium/Widgets/widgets.css" /> 
    
    <!-- 线上
    <script src="https://cesiumjs.org/releases/1.62/Build/Cesium/Cesium.js"></script>
    <script src="https://cesiumjs.org/releases/1.62/Apps/Sandcastle/Sandcastle-header.js"></script>
    <link href="https://cesiumjs.org/releases/1.62/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> -->
</head>

<body>
      <div id="cesiumContainer"></div>
      <div id="toolbar" style="margin: 5px;padding: 2px 5px;position: absolute;top:50px"></div>
      <script>
        var viewer = new Cesium.Viewer('cesiumContainer', {
            selectionIndicator: false,
            infoBox: false, 
        });
        
            var longitude = 116.39123;
            var latitude = 39.905;
            var height = 1000;
            var heading = 0;
            var tileset = new Cesium.Cesium3DTileset({
                url:url //此处填入发布服务的网址
            });
            // tileset.style = new Cesium.Cesium3DTileStyle({
            //     color: {
            //         conditions: [
            //             // ["${height} > 0", "color('#FFF', 0.5)"],
            //             ['true', "color('#FFFF00', 0.5)"]
            //         ]
            //     }
            // });
           
            viewer.scene.primitives.add(tileset);
            tileset.readyPromise.then(function (argument) {
                var position = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
                var mat = Cesium.Transforms.eastNorthUpToFixedFrame(position);
                var rotationX = Cesium.Matrix4.fromRotationTranslation(Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(heading)));
                Cesium.Matrix4.multiply(mat, rotationX, mat);
                tileset._root.transform = mat;
                viewer.camera.flyTo({ destination: Cesium.Cartesian3.fromDegrees(longitude, latitude, height + 1000) });    
            });  
    </script>
    
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

最后的Cesiumlab的展示结果
代码的展示结果
其中heading、pitch、roll可以设置旋转参数（我的好像没写pitch和roll）

ps:上面更改点云位置的代码，当点云数据量大时可能无法生效（我也不知道为什么），此时可以将点云用cloudcompare进行抽稀，将数据量减小，再使用代码更改位置即可。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家小花儿/article/detail/220535