1.初始化
var terrainModels = Cesium.createWorldTerrain();Cesium.Ion.defaultAccessToken = 'Token'var viewer = new Cesium.Viewer("cesiumContainer", {terrainProvider: terrainModels,animation: true,del: terrainModels[1] ,// Select STK high-res terrain});
2.加载CZML
CZML是一种用来描述动态场景的JSON架构的语言,主要用于Cesium在浏览器中的展示,某种程度上说, Cesium 和 CZML的关系就像 Google Earth 和 KML
CZML是JSON的子集,这意味着有效的CZML文档也是有效的JSON文档。 具体来说,CZML文档包含一个JSON数组,其中数组中的每个对象文字元素都是一个CZML数据包(packet)。 CZML数据包描述了场景中单个对象(例如单个汽车)的图形属性。
Cesium提供了一个CzmlDataSource直接加载 czml数据
var scene = viewer.scene;var clock = viewer.clock;var entity;var positionProperty;var dataSourcePromise = Cesium.CzmlDataSource.load("./SampleData/ClampToGround_ceshi.czml");
viewer.dataSources.add(dataSourcePromise).then(function (dataSource) {entity = dataSource.entities.getById("CesiumMilkTruck"); //获取glb实体entity.orientation = new Cesium.VelocityOrientationProperty(entity.position);//设置模型朝向按照指定路线positionProperty = entity.position;});
CMZL中的glb如图
3.加载模型
var tileset = scene.primitives.add(new Cesium.Cesium3DTileset({url: '自己的模型'}));viewer.zoomTo(tileset);
4.模型加载后执行
if (scene.clampToHeightSupported) {tileset.initialTilesLoaded.addEventListener(start); //3D Tiles渲染完成后执行} else {window.alert("This browser does not support clampToHeight.");}function start() {clock.shouldAnimate = true;var objectsToExclude = [entity];scene.postRender.addEventListener(function () {var position = positionProperty.getValue(clock.currentTime);entity.position = scene.clampToHeight(position, objectsToExclude);});}