# cesium-加载点云数据
# 点云数据介绍
点云数据（point cloud data）是指在一个三维坐标系统中的一组向量的集合。
扫描资料以点的形式记录，每一个点包含有三维坐标，有些可能含有颜色信息（RGB）或反射强度信息（Intensity）。
点云数据除了具有几何位置以外，有的还有颜色信息。颜色信息通常是通过相机获取彩色影像，然后将对应位置的像素的颜色信息（RGB）赋予点云中对应的点。强度信息的获取是激光扫描仪接收装置采集到的回波强度，此强度信息与目标的表面材质、粗糙度、入射角方向，以及仪器的发射能量，激光波长有关。
# cesium加载点云数据
- 使用cloudCompare (opens new window)处理数据，另存为las数据
- cesiumlab只能处理las的点云数据，因此需要将其他格式的点云数据转换成las格式
- 使用cesiumlab将点云数据切片成3dTiles数据，并发布
- 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>cesium加载点云数据</title>
<script src="../lib/Cesium-1.78/Build/Cesium/Cesium.js"></script>
<style>
@import url(../lib/Cesium-1.78/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>
//天地图token
let TDT_tk = "token";
//Cesium token
let cesium_tk = "ecesium token";
//天地图影像
let TDT_IMG_C = "http://{s}.tianditu.gov.cn/img_c/wmts?service=wmts&request=GetTile&version=1.0.0" +
"&LAYER=img&tileMatrixSet=c&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}" +
"&style=default&format=tiles&tk=" + TDT_tk;
//标注
let TDT_CIA_C = "http://{s}.tianditu.gov.cn/cia_c/wmts?service=wmts&request=GetTile&version=1.0.0" +
"&LAYER=cia&tileMatrixSet=c&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}" +
"&style=default&format=tiles&tk=" + TDT_tk;
//初始页面加载
Cesium.Ion.defaultAccessToken = cesium_tk;
let viewer = new Cesium.Viewer('cesiumContainer', {
geocoder: false, // 位置查找工具
baseLayerPicker: false,// 图层选择器（地形影像服务）
timeline: false, // 底部时间线
homeButton: false,// 视角返回初始位置
fullscreenButton: false, // 全屏
animation: false, // 左下角仪表盘（动画器件）
sceneModePicker: false,// 选择视角的模式（球体、平铺、斜视平铺）
navigationHelpButton: false, //导航帮助按钮
imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
url: TDT_IMG_C,
layer: "tdtImg_c",
style: "default",
format: "tiles",
tileMatrixSetID: "c",
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
tilingScheme: new Cesium.GeographicTilingScheme(),
tileMatrixLabels: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19"],
maximumLevel: 50,
show: false
})
});
//调用影响中文注记服务
viewer.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
url: TDT_CIA_C,
layer: "tdtImg_c",
style: "default",
format: "tiles",
tileMatrixSetID: "c",
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
tilingScheme: new Cesium.GeographicTilingScheme(),
tileMatrixLabels: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19"],
maximumLevel: 50,
show: false
}))
// 去除版权信息
viewer._cesiumWidget._creditContainer.style.display = "none";
// cesium加载代码
let tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: '../data/point/demo01/tileset.json',
modelMatrix: Cesium.Matrix4.fromArray([0.8552283504631701,-0.2967752313214851,0.42486342586544634,0,0.2551799488400847,0.9546798336592429,0.1531979403070799,0,-0.45107389890572935,-0.0226025945068119,0.892200347706469,0,-11154.08899100963,-2844.983343217522,127.76873376127332,1]),
}));
viewer.flyTo(tileset);
</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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
# 实现效果
← 加载DEM数据 定位到3DTiles对象 →