3D Tiles是用於傳輸和渲染大規模3D地理空間數據的格式,例如攝影測量,3D建築,BIM / CAD,實例化特徵和點雲等。與常規的模型文件格式相比,最大的特色就是包含了分層分戶的瓦片,根據可視化須要呈現相應的細節,而且已經被歸入到OGC規範當中。css
在Cesium的自帶示例3D Tiles Photogrammetry中,展現的攝影測量3DTiles數據是經過Cesium Ion上託管的,只須要相應的編號就能夠了。實際生產中的3DTiles數據能夠經過像ContextCapture這樣的三維建模軟件獲得,而後經過Cesium本地加載。html
HTML頁面3DTilesPhotogrammetry.html代碼以下:java
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <meta name="description" content="A sample photogrammetry dataset rendered with 3D Tiles."> <meta name="cesium-sandcastle-labels" content="Beginner, Tutorials, Showcases"> <title>Cesium Demo</title> <script type="text/javascript" src="../Build/Cesium/Cesium.js"></script> <style> @import url(../Build/Cesium/Widgets/widgets.css); html, body { width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden; font-family: sans-serif; background: #000; } .fullSize { display: block; position: absolute; top: 0; left: 0; border: none; width: 100%; height: 100%; } </style> </head> <body> <div id="cesiumContainer" class="fullSize"></div> <script src="3DTilesPhotogrammetry.js"></script> </body> </html>
主要的javascript代碼3DTilesPhotogrammetry.js以下:json
'use strict'; var viewer = new Cesium.Viewer('cesiumContainer', { terrainProvider: Cesium.createWorldTerrain() }); var tileset = new Cesium.Cesium3DTileset({ url: "../dayanta/tileset.json" }); viewer.scene.primitives.add(tileset); viewer.zoomTo(tileset);
能夠看到這裏經過3DTiles數據路徑,建立了一個Cesium.Cesium3DTileset對象。但與加載glTF模型不一樣,加載3DTiles須要將其加入到場景類(viewer.scene)的圖元集合對象(primitives)中去。圖元類(Cesium.Primitive)也就是場景中的幾何圖形,Cesium應該是將3DTiles做爲圖元展現在場景中。ide
最終運行結果以下所示,展現了西安大雁塔景區的模型:ui