## 绘制点线面 ### 方案一:通过entity来添加 ### 先来看一个添加立方体的例子 ``` var viewer = new Cesium.Viewer('cesiumContainer'); 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 } }); viewer.zoomTo(viewer.entities); ``` 效果如图: ![](https://box.kancloud.cn/cb0f7476457c6ab82d4f1501c973c45b_352x319.jpg) ### 方案二:通过CZML添加 通过CZML也可以添加几何形状,而且CZML还可以描述动画(现在先有个印象,动画以后介绍) 先来看看官网上的说明,CZML是一种JSON格式的字符串,用于描述与时间有关的动画场景,CZML包含点、线、地标、模型、和其他的一些图形元素,并指明了这些元素如何随时间而变化。某种程度上说, Cesium 和 CZML的关系就像 Google Earth 和 KML。 ``` var czml = [{ "id" : "document", "name" : "box", "version" : "1.0" },{ "id" : "shape2", "name" : "Red box with black outline", "position" : { "cartographicDegrees" : [-107.0, 40.0, 300000.0] }, "box" : { "dimensions" : { "cartesian": [400000.0, 300000.0, 500000.0] }, "material" : { "solidColor" : { "color" : { "rgba" : [255, 0, 0, 128] } } }, "outline" : true, "outlineColor" : { "rgba" : [0, 0, 0, 255] } } }]; var viewer = new Cesium.Viewer('cesiumContainer'); var dataSourcePromise = Cesium.CzmlDataSource.load(czml); viewer.dataSources.add(dataSourcePromise); viewer.zoomTo(dataSourcePromise); ``` ### 形状相关描述 >下表来自于官方网站,但是连接改为本地链接了 | | | | |---|---|---| |Point|![point](https://box.kancloud.cn/37a2f9f33aef25a9c663ab3c5d93b753_80x80.png)|entity.point - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/PointGraphics.html) |Boxes|![Box](https://box.kancloud.cn/e1ee4c17af62556eea6f05003238dd11_80x80.png)|entity.box - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Box.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/BoxGraphics.html) |Circles and Ellipses|![Ellipse](https://box.kancloud.cn/d23a64aae7b087a9a2fe0c8bb95eeb7d_80x80.png)|entity.ellipse - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Circles%20and%20Ellipses.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/EllipseGraphics.html) |Corridor|![Corridor](https://box.kancloud.cn/5211d4b0e624b89d7be7316b75d5321c_80x80.png)|entity.corridor - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Corridor.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/CorridorGraphics.html) |Cylinder and Cones|![Cylinder](https://box.kancloud.cn/3bee256207ed3a2d0548929ce69e7d48_80x80.png)|entity.cylinder - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Cylinders%20and%20Cones.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/CyilnderGraphics.html) |Polygons|![Polygon](https://box.kancloud.cn/6ffb449bd12c69dcf3f51b65c66cf4a4_80x80.png)|entity.polygon - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Polygon.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/PolygonGraphics.html) [Reference Build/Documentation] |Polylines|![Polyline](https://box.kancloud.cn/ee2a7e46a321b449599c5bed5bdb2a6b_80x80.png)|entity.polyline - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Polyline.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/PolylineGraphics.html) |Polyline Volumes|![Volume](https://box.kancloud.cn/ac9d50e3b9b60c2284510f9e587893af_80x80.png)|entity.polylineVolume - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Polyline%20Volume.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/PolylineVolume.html) |Rectangles|![Rectangle](https://box.kancloud.cn/1afcabfe8fa54d557636dc10f6d35eae_80x80.png)|entity.rectangle - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Rectangle.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/Rectangle.html) |Spheres and Ellipsoids|![Ellipsoid](https://box.kancloud.cn/43543d666218de7d9e68c58b3f0d88e5_80x80.png)|entity.ellipsoid - [Code example](http://localhost:8080/Apps/Sandcastle/index.html?src=Spheres%20and%20Ellipsoids.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/EllipsoidGraphics.html) |Walls|![Wall](https://box.kancloud.cn/b6fa2e455c2e39571cce13d24149b60a_80x80.png)|entity.wall - (http://localhost:8080/Apps/Sandcastle/index.html?src=Wall.html) - [Reference Build/Documentation](http://localhost:8080/Build/Documentation/WallGraphics.html) **Cesium学习交流群:593764057(满),476893082**