知识点和api都以注释的形式标注在了代码中,学习Cesium官方案例可以作为辅助理解代码,进行自我学习和案例复现。
主要学习网站:cesium官网案例源码 cesium中文网api文档
Cesium.Ion.defaultAccessToken =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3YjIzYWFlOS1iMzE4LTQ5ZmUtYmUyOS0yMWZlYmE5Yzg4Y2MiLCJpZCI6MTIyNzExLCJpYXQiOjE2NzUwNjAyNTR9.FlRXWHoB1XNQR4wi-_VGVJeOUMrVynCEGfcHgPHUmKY";
const viewer=new Cesium.Viewer("cesiumContainer",{
shouldAnimate:true,
});
const dates=[
"2018-07-19T15:18:00Z",
"2018-07-19T15:18:00.5Z",
"2018-07-19T15:18:01Z",
"2018-07-19T15:18:01.5Z",
"2018-07-19T15:18:02Z",
"2018-07-19T15:18:02.5Z",
]
const uris = [
"../Source/SampleData/Cesium3DTiles/PointCloud/PointCloudTimeDynamic/0.pnts",
"../Source/SampleData/Cesium3DTiles/PointCloud/PointCloudTimeDynamic/1.pnts",
"../Source/SampleData/Cesium3DTiles/PointCloud/PointCloudTimeDynamic/2.pnts",
"../Source/SampleData/Cesium3DTiles/PointCloud/PointCloudTimeDynamic/3.pnts",
"../Source/SampleData/Cesium3DTiles/PointCloud/PointCloudTimeDynamic/4.pnts",
];
function dataCallback(interval,index){
return {
uri:uris[index],
};}
const timeIntervalCollection=Cesium.TimeIntervalCollection.fromIso8601DateArray(
//从 ISO 8601 日期数组创建一个新实例。
{
iso8601Dates:dates,
// 一组 ISO 8601 日期
dataCallback:dataCallback,
//一个函数,它将返回在将每个间隔添加到集合之前调用的数据。
//如果未指定,数据将是集合中的索引。
}
);
const pointCloud = new Cesium.TimeDynamicPointCloud({
//提供时间动态点云数据的回放。
//点云帧按平均帧加载时间和当前时钟速度确定的间隔进行预取。
//如果中间帧不能及时加载以满足播放速度,它们将被跳过。
//如果帧足够小或时钟足够慢,则不会跳过任何帧。
intervals: timeIntervalCollection,
//一个 TimeIntervalCollection ,它的 data 属性是一个对象,
//其中包含一个到 3D Tiles Point Cloud tile 的 uri 和一个可选的 transform 。
clock: viewer.clock,
//在确定时间维度的值时使用的 Clock 实例。
style: new Cesium.Cesium3DTileStyle({
pointSize: 5,
}),
//使用 3D Tiles Styling 语言 定义的样式,应用于点云中的每个点
});
viewer.scene.primitives.add(pointCloud);
//获取原语的集合
//将原语添加到集合中。
const start=Cesium.JulianDate.fromIso8601(dates[0]);
const stop=Cesium.JulianDate.fromIso8601(dates[dates.length-1]);
viewer.timeline.zoomTo(start,stop);
const clock=viewer.clock;
clock.startTime=start;
clock.currentTime=start;
clock.stopTime=stop;
clock.clockRange=Cesium.ClockRange.LOOP_STOP;
viewer.zoomTo(
pointCloud,
new Cesium.HeadingPitchRange(0.0,-0.5,50.0)
//航向 俯仰 到中心的距离
//定义局部框架中的航向角、俯仰角和范围。
//航向是从当地的北向旋转,正角向东增加。
//俯仰是从局部 xy 平面旋转。正俯仰角在平面上方。
//负俯仰角位于平面下方。范围是距框架中心的距离。
);