Cesium-数据加载（geojson、czml、gltf、3dtiles）

下面展示几种常用cesium加载方式。

1.geojson加载

geojson数据直接加载，样式直接设置，或者可以拿到该数据源进行单独设置

//cesium加载 geojson格式数据 Cesium.GeoJsonDataSource.load("/static/json/xx.geojson", { //设置geojson样式 stroke: Cesium.Color.WHITE, fill: Cesium.Color.fromRandom({ alpha: 0.0 }), strokeWidth: 3, markerSymbol: "?", camera: viewer.scene.camera, canvas: viewer.scene.canvas }).then(dataSource=>{ dataSource.name = 'xx';//设置数据name viewer.dataSources.add(dataSource)//添加数据 })

2.czml

它的样式都可以czml数据里面设置，不用去在单独设置，并且czml支持多种数据类型。

let czml = [ { id: "document", name: "火点", version: "1.0" },{ id: "火点1", name: "火点1", //availability: "2012-08-04T16:00:00Z/2012-08-04T16:05:00Z", position: { //epoch: "2012-08-04T16:00:00Z", cartographicDegrees: [113, 32, 0]//设置坐标 }, billboard: { image: "/static/img/map/fire.png",//设置火电的图片 scale: 1 }, path: { resolution: 1, material: new Cesium.PolylineGlowMaterialProperty({ glowPower: 0.1, color: Cesium.Color.YELLOW }), width: 3 } } ]; // 加载提供的URL或CZML对象，替换任何现有数据。 let dataSourcePromise = Cesium.CzmlDataSource.load(czml); viewer.dataSources.add(dataSourcePromise).then(res => { // let s = res.entities.getById("火点1"); //获取指定id的entities func && func(res);//回调 });

3.gltf

加载模型，并设置他的角度

var modelcollection = new Cesium.PrimitiveCollection(); scene.primitives.add(modelcollection); // 设置模型角度 let hpr = new Cesium.HeadingPitchRoll(Cesium.Math.toRadians(90), 0, 0); let origin = Cesium.Cartesian3.fromDegrees(113,31,0); let modelMatrix = Cesium.Transforms.headingPitchRollToFixedFrame(origin, hpr); //添加模型 modelcollection.add(Cesium.Model.fromGltf({ id: '模型1', url: '/static/gltf/model1.gltf', modelMatrix: modelMatrix, scale: 2.0 }))

4.3dtiles

可以加载点云数据

let tileset = new Cesium.Cesium3DTileset({ url:"/model/xxx//tileset.json", modelMatrix: Cesium.Matrix4.fromArray([1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]) }); viewer.scene.primitives.add(tileset);