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);