cesium实现注记功能

 希望实现：加载json外部文件的行政区划图，实现贴地效果，并在每个行政区划的中间做一个label显示地名，实现类似天地图的注记功能。

首先，理解几个知识点

#PolygonGraphics(options)感谢以前还不算差的英语，考研71分好像，至少现在读英文API能大概知道什么意思...真的是大概

API的描述：Describes a polygon defined by an hierarchy of linear rings which make up the outer shape and any nested holes. The polygon conforms to the curvature of the globe and can be placed on the surface or at altitude and can optionally be extruded into a volume.

PolygonGraphics（多边形面图形）是由各个层次的线所组成的面构成（外边、内边），这个多边形能够适应球体，能够被设置在球体表面或者特定高度，也能够放置（缩放）在特定空间。

Name

Type

Description

options

Object

optional Object with the following properties:

Name	Type	Default	Description
show	Property	true	optional A boolean Property specifying the visibility of the polygon.
hierarchy	Property		optional A Property specifying the PolygonHierarchy.
height	Property	0	optional A numeric Property specifying the altitude of the polygon relative to the ellipsoid surface.
heightReference	Property	HeightReference.NONE	optional A Property specifying what the height is relative to.位置高程参考
extrudedHeight	Property		optional A numeric Property specifying the altitude of the polygon's extruded face relative to the ellipsoid surface.
extrudedHeightReference	Property	HeightReference.NONE	optional A Property specifying what the extrudedHeight is relative to.拉升高度参考
stRotation	Property	0.0	optional A numeric property specifying the rotation of the polygon texture counter-clockwise from north.
granularity粒子	Property	Cesium.Math.RADIANS_PER_DEGREE	optional A numeric Property specifying the angular distance between each latitude and longitude point.
fill	Property	true	optional A boolean Property specifying whether the polygon is filled with the provided material.
material填充材质	MaterialProperty	Color.WHITE	optional A Property specifying the material used to fill the polygon.
outline外	Property	false	optional A boolean Property specifying whether the polygon is outlined.
outlineColor	Property	Color.BLACK	optional A Property specifying the Color of the outline.
outlineWidth	Property	1.0	optional A numeric Property specifying the width of the outline.
perPositionHeight	Property	false	optional A boolean specifying whether or not the the height of each position is used.
closeTop封顶	Boolean	true	optional When false, leaves off the top of an extruded polygon open.
closeBottom封底	Boolean	true	optional When false, leaves off the bottom of an extruded polygon open.
arcType弧形状，球体上两点之间点连线是有多种方式的，不是平面，一般用大地线，也就是最短路径线	Property	ArcType.GEODESIC	optional The type of line the polygon edges must follow.
shadows阴影	Property	ShadowMode.DISABLED	optional An enum Property specifying whether the polygon casts or receives shadows from each light source.
distanceDisplayCondition距离显示	Property		optional A Property specifying at what distance from the camera that this polygon will be displayed.
classificationType贴地形还是贴3dtiles	Property	ClassificationType.BOTH	optional An enum Property specifying whether this polygon will classify terrain, 3D Tiles, or both when on the ground.
zIndex类似html5的显示层次	ConstantProperty	0	optional A property specifying the zIndex used for ordering ground geometry. Only has an effect if the polygon is constant and neither height or extrudedHeight are specified.

#PolygonGeometry

API是这么写的A description of a polygon on the ellipsoid. The polygon is defined by a polygon hierarchy. Polygon geometry can be rendered with both Primitive and GroundPrimitive.

球体上的多边形，多边形可以是层次嵌套，多边形几何实例可以使用primitive方式或者GroundPrimitive渲染，所以polygonGeometry是球体实例，只能用primitive方式渲染，使用entity方式生成实例时候就不要来查geometry的API了。

 #多边形的中点

boundingSphere类，api的定义：A bounding sphere with a center and a radius.

Cesium.BoundingSphere.fromPoints(positions, result) → BoundingSphere

#HorizontalOrigin与VerticalOrigin  平面上的水平朝向与垂直朝向

#distanceDisplayCondition与scaleByDistance

distanceDisplayCondition:new Cesium.DistanceDisplayCondition(0,100000),在这个范围内可见

scaleByDistance:new Cesium.NearFarScalar(100, 0.5, 100000, 0.6)，在（小于）100米时候scale为0.5，100-100000（大于）米之间逐渐放大到0.6

#最基础的实现，先实现显示注记

var jsonPromise = new Cesium.GeoJsonDataSource.load("./data/jxgeojson.json");
jsonPromise.then(function(datasource){
    viewer.dataSources.add(datasource);
    var entities = datasource.entities.values;
    for (let i = 0; i < entities.length; i++) {
        var entity  = entities[i];
　　　　//名称用加载数据的一项属性
        entity.name = entity.properties.XZQMC;
　　　　//获取此时此刻的点集
　　　　//整个Entity API的属性设计是不仅仅考虑是一个常量值，而需要设置一些随时间变换的值。

　　　　　//所有的属性类实现 Property 接口, Cesium中定义了很多种属性类。为了读取属性的值，我们需要调用 getValue函数,时间参数传当前场景时间即可。

       //vacr poinitsArray = entity.polygon.hierarchy.getValue(Cesium.clock.currentTime).positions;效果一样 
       var pointsArray = entity.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions;
　　　　//获取entity的polygon的中心点
        var centerpoint = Cesium.BoundingSphere.fromPoints(pointsArray).center;
      //将entity的position设置为centerpoint，这里很好奇一个polygon没有position么，
　　　　//如果没有设置，确实为undefined
　　　　 entity.position = centerpoint;
　　　　//设置标签名称
        entity.label={
            text:entity.name
        }
    }
})

#改进显示注记

jsonPromise.then(function(datasource){
    viewer.dataSources.add(datasource);
    var entities = datasource.entities.values;
    for (let i = 0; i < entities.length; i++) {
        var entity  = entities[i];
        if(Cesium.defined(entity.polygon))//设置entity.polygon的样式
        {
            entity.polygon.material=new Cesium.Color.fromRandom({maximumRed:0.8,maximumBlue:0.8,maximumGreen:0.7,alpha:0.5});
           //ClassificationType:Whether a classification affects terrain, 3D Tiles or both. 
            entity.polygon.classificationType=Cesium.ClassificationType.TERRAIN;
            entity.name = entity.properties.XZQMC;
        }        
        var pointsArray = entity.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions;
        var centerpoint = Cesium.BoundingSphere.fromPoints(pointsArray).center;
        entity.position = centerpoint;
        entity.label={
            text:entity.name,
            scale:1,
            showBackground:true,
            //水平朝向，就是这个label放在position的左，中，右
            horizontalOrigin:Cesium.HorizontalOrigin.LEFT,
            verticalOrigin:Cesium.VerticalOrigin.CENTER,
            distanceDisplayCondition:new Cesium.DistanceDisplayCondition(0,10000),
　　　　　　　//远近-大小的关系设置
            scaleByDistance:new Cesium.NearFarScalar(0.5, 0.5, 3, 0.5)
        }
    }
})