Cesium快速上手10-Viewer Entities组合

Viewer/Entities的作用:

方便创建直观的对象,同时做到性能优化(billboard、point等)
提供一些方便使用的函数:flyTo/zoomTo
赋予Entity对象时间这个属性,对象具备动态特性/Primitive不具备
提供一些UI(homeButton/sceneModePicker/projectionPicker/baseLayerPicker)
大量的快捷方式,camera等未必是好事。。
Datasource模式来加载大规模数据:Geojson
Datasource结构
Entities是一个快捷方式,其实返回的是viewer.dataSourceDisplay.defaultDatasource.entities ;

Entity结构

Cesium快速上手10-Viewer Entities组合

image.png

var viewer = new Cesium.Viewer('cesiumContainer');

示例 可参考 Geometries

Cesium快速上手10-Viewer Entities组合

image.png

box示例

http://localhost:8080/Apps/Sandcastle/index.html?src=Box.html&label=Geometries

Cesium快速上手10-Viewer Entities组合

image.png

box 就是立方体
cylinder 是圆锥 圆柱

var viewer = new Cesium.Viewer('cesiumContainer');

var blueBox = viewer.entities.add({
    name : 'Blue box',
    position: Cesium.Cartesian3.fromDegrees(-114.0, 40.0, 300000.0),
    box : {
        dimensions : new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
        material : Cesium.Color.BLUE
    }
});

var redBox = viewer.entities.add({
    name : 'Red box with black outline',
    position: Cesium.Cartesian3.fromDegrees(-107.0, 40.0, 300000.0),
    box : {
        dimensions : new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
        material : Cesium.Color.RED.withAlpha(0.5),
        outline : true,
        outlineColor : Cesium.Color.BLACK
    }
});

var outlineOnly = viewer.entities.add({
    name : 'Yellow box outline',
    position: Cesium.Cartesian3.fromDegrees(-100.0, 40.0, 300000.0),
    box : {
        dimensions : new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
        fill : false,
        outline : true,
        outlineColor : Cesium.Color.YELLOW
    }
});

viewer.zoomTo(viewer.entities);

圆锥 圆柱

http://localhost:8080/Apps/Sandcastle/index.html?src=Cylinders%20and%20Cones.html&label=Geometries

Cesium快速上手10-Viewer Entities组合

image.png

topRadius = bottomRadius 是圆柱
topRadius=0, bottomRadius 大于0 是圆锥

var viewer = new Cesium.Viewer('cesiumContainer');

var greenCylinder = viewer.entities.add({
    name : 'Green cylinder with black outline',
    position: Cesium.Cartesian3.fromDegrees(-100.0, 40.0, 200000.0),
    cylinder : {
        length : 400000.0,
        topRadius : 200000.0,
        bottomRadius : 200000.0,
        material : Cesium.Color.GREEN.withAlpha(0.5),
        outline : true,
        outlineColor : Cesium.Color.DARK_GREEN
    }
});

var redCone = viewer.entities.add({
    name : 'Red cone',
    position: Cesium.Cartesian3.fromDegrees(-105.0, 40.0, 200000.0),
    cylinder : {
        length : 400000.0,
        topRadius : 0.0,
        bottomRadius : 200000.0,
        material : Cesium.Color.RED
    }
});

viewer.zoomTo(viewer.entities);

API文档

Entity
Cesium.EntityCollection

对比primitives 与Entity

    1. 与primitives 相比,entity 使用更简便。一个entity可能是由多个primitives组合完成的。
    1. entity内部实现的时候还是用primitives实现的;entity更高层一点。primitive需要关注更多的细节;
  • 3.单个Primitive只能绑定一个材质Appearance,所有的GeometryInstance都使用这一个Appearance;要更换不同的Appearance,就得用不同的Primitive;初始化时还涉及坐标旋转以使绘制的图形在地图表面显示出来。

Cesium快速上手10-Viewer Entities组合

image.png

实现同样的效果,比较两种实现方式
primitive方式
entity方式

Datasource结构

Cesium快速上手10-Viewer Entities组合

image.png

每一个Datasource都挂在Entity下;

geojson

http://localhost:8080/Apps/Sandcastle/index.html?src=GeoJSON%20and%20TopoJSON.html&label=DataSources

Cesium快速上手10-Viewer Entities组合

image.png

http://localhost:8080/Apps/Sandcastle/index.html?src=GeoJSON%20simplestyle.html&label=DataSources

Cesium快速上手10-Viewer Entities组合

image.png

Custom DataSource 自定义数据源格式

http://localhost:8080/Apps/Sandcastle/index.html?src=Custom%20DataSource.html&label=DataSources

Cesium快速上手10-Viewer Entities组合

image.png

其他

  • flyTo
    viewer.flyTo(target, options) 直接飞到目标物上,如3dTiles ; 异步操作,若目前没有目标数据,会等待目标准备好之后再飞过去;
    camera.flyTo 飞到坐标点上或者某个区域上,

本文转自 https://www.jianshu.com/p/dd5e83b333a0,如有侵权,请联系删除。

上一篇:SQL 如何返回最大值所在的多条记录


下一篇:cesium中限制地图浏览范围