Cesium入门9 - Loading and Styling Entities - 加载和样式化实体

Cesium入门9 - Loading and Styling Entities - 加载和样式化实体

Cesium中文网：http://cesiumcn.org/ | 国内快速访问：http://cesium.coinidea.com/

现在我们已经为我们的应用程序设置了Viewer配置、imagery和terrain的阶段，我们可以添加我们的应用程序的主要焦点——geocache数据。

为了便于可视化，Cesium支持流行的矢量格式GeoJson和KML，以及一种我们团队自己开源的格式，我们专门开发用于描述Cesium场景的[]CZML](https://github.com/AnalyticalGraphicsInc/czml-writer/wiki/CZML-Guide)。

无论初始格式如何，Cesium中的所有空间数据都使用Entity API来表示。Entity API以一种有效提供灵活的可视化的方式，以便对Cesium进行渲染。Cesium Entity是可以与样式化图形表示配对并定位在空间和时间上的数据对象。测试沙盒中提供了许多简单Entity的例子。为了在Entity API的基础上加快速度，从这个应用程序中休息一下，然后阅读可视化的空间数据教程 Visualizing Spatial Data tutorial。

以下有一些关于不同entity类型的例子：

• Polygon
• Polyline
• Billboard
• Label

一旦你掌握了一个Entity的样子，用Cesium装载数据集将是变得容易理解。要读取数据文件，需要创建适合于数据格式的数据源DataSource，该数据源将解析在指定URL中承载的数据文件，并为数据集中的每个地理空间对象创建包含Entity的EntityCollection***。DataSource只是定义了一个接口——您需要的数据源的确切类型将取决于数据格式。例如，KML使用KmlDataSource*源代码。比如：

var kmlOptions = {
   
    camera : viewer.scene.camera,
    canvas : viewer.scene.canvas,
    clampToGround : true
};
// Load geocache points of interest from a KML file
// Data from : http://catalog.opendata.city/dataset/pediacities-nyc-neighborhoods/resource/91778048-3c58-449c-a3f9-365ed203e914
var geocachePromise = Cesium.KmlDataSource.load('./Source/SampleData/sampleGeocacheLocations.kml', kmlOptions);

上述代码读取我们样例的geocahce点，从一个KML文件中，调用KmlDataSource.load(optinos)带一些配置。针对一个KmlDataSource，相机和Canvas配置项是必须的。clamptoGround选项激活了ground clamping**，一种流行的描述配置用于是地面的几何entities比如多边形和椭圆符合地形而且遵从WGS84椭圆面。

由于这些数据是异步加载的，因此针对KmlDataSource返回一个的Promise，它将包含我们所有新创建的entities。

如果您不熟悉使用异步函数的PromiseAPI，这里的“异步”基本上意味着您应该在所提供的回调函数中完成所需的数据**.then.为了实际地将这些实体集合添加到场景中，我们必须等待直到promise完成，然后将KmlDataSource添加viewer.datasrouces**。取消以下几行注释：

// Add geocache billboard entities to scene and style them
geocachePromise.then(function(dataSource) {
   
    // Add the new data as entities to the viewer
    viewer.dataSources.add(dataSource);
});

默认情况下，这些新创建的实体具有有用的功能。单击将显示与实体相关的元数据的信息框Infobox，并双击缩放并查看实体。若要停止查看该实体，请单击“home”按钮，或单击“信息框”上的“划出”相机图标。接下来，我们将添加自定义样式来改善我们的应用程序的外观style。

对于KML和CZML文件，可以在文件中建立声明式样式。然而，对于这个应用，让我们练习手动设计我们的实体。要做到这一点，我们将采取类似的方法来处理这个样式示例，等待我们的数据源加载，然后迭代数据源集合中的所有实体，修改和添加属性。默认情况下，我们的geocache点标记被创建为Billboards和Labels，所以为了修改这些实体的外观，我们这样做：

// Add geocache billboard entities to scene and style them
geocachePromise.then(function(dataSource) {
   
    // Add the new data as entities to the viewer
    viewer.dataSources.add(dataSource);

    // Get the array of entities
    var geocacheEntities = dataSource.entities.values;

    for (var i =