1.3dtiles 文件夹结构预览
tileset.json 是入口文件,使用时需要从外部引用 .
2.Cesium 加载3dtiles
//加载3dtiles数据
this.
palaceTileset =
viewer.
scene.
primitives.
add(
new
Cesium.
Cesium3DTileset({
url:
'resource/mx04/tileset.json',
//优化项
dynamicScreenSpaceError :
true,
dynamicScreenSpaceErrorDensity :
0.00278,
dynamicScreenSpaceErrorFactor :
4.0,
dynamicScreenSpaceErrorHeightFalloff :
0.25
}));
还有更多配置项,从
http://cesium.xin/cesium/cn/Documentation1.72/Cesium3DTileset.html?classFilter=3d 查看
3.相关事件
(1).加载模型之前触发
this.
palaceTileset.
readyPromise.
then((
tileset)
=> {})
可以在此事件中设置模型的地理位置、放大、缩小、旋转等操作，还可以在此设置摄像机所处的位置和角度。
(2).加载进度
//加载进度 正在请求、模型加载
this.
palaceTileset.
loadProgress.
addEventListener(
function (
numberOfPendingRequests,
numberOfTilesProcessing) {
if ((
numberOfPendingRequests ===
1) && (
numberOfTilesProcessing ===
0)) {
cl.
setLoaded(
40);
}
if ((
numberOfPendingRequests ===
0) && (
numberOfTilesProcessing ===
1)) {
cl.
setLoaded(
70);
}
if ((
numberOfPendingRequests ===
0) && (
numberOfTilesProcessing ===
0)) {
cl.
setLoaded(
100);
return;
}
});
其中cl.setLoaded(number) 是设置加载动画的进度，根据事件返回的数据请求状态和模型加载状态来判断。
(3).模型加载完成事件
//所有模型加载完成事件
this.
palaceTileset.
allTilesLoaded.
addEventListener(()
=> { })
此事件触发后相当于页面加载完成
通过
let
featureList =
this.
palaceTileset.
_selectedTiles[
0].
content.
_features;
可获得 所有 Cesium3DTileFeature 对象，可获得一些附加属性和设置模型的颜色
4.效果展示
JPG
PNG
JPEG