Cesium入门03-创建实体

这里会举几个Cesium创建实体的例子,不全面,只是冰山一角。

1、创建椭圆

var redEllipse = viewer.entities.add({
   position: Cesium.Cartesian3.fromDegrees(-120, 40.0, 100000.0),
   name : 'red ellipse',
   ellipse : {
     semiMinorAxis : 150000.0,//短半轴
     semiMajorAxis : 300000.0,//长半轴
     extrudedHeight : 200000.0,//挤出高度
     // rotation : Cesium.Math.toRadians(45),
     //rotation可以设置旋转角度,逆时针。
     material : Cesium.Color.RED.withAlpha(0.5),
     //材质属性,这里选用红色+透明;还可以配置图片或其他格式(如棋盘格纹)
     outline : false 
     //边框属性,可以设置有无边框;
   },
     description: '\
        <img\
        width="50%"\
        style="float:left;"\
        src="//upload-images.jianshu.io/upload_images/11335939-74859613aa6e55a8.jpg?imageMogr2/auto-orient/strip|imageView2/2/w/768">\
        <p>这是什么丑东西?!</p>\
        <p>呕,我吐了!</p>'
      });

在这里插入图片描述属性Description的作用是对实体添加备注,单击实体会弹出文字和图片(格式自己配置,和html格式一致)。
在这里插入图片描述

2、创建多个实体

只需要viewer.entities.add()多个实体即可:
①创建绿色点:

var greenpoint = viewer.entities.add({
       name:'green point',
       position: Cesium.Cartesian3.fromDegrees(-110.0, 40.0, 300000.0),
       point:{
         pixelSize:38,
         color:Cesium.Color.GREEN
       }
 });

②创建红色正方体:

var redbox = viewer.entities.add({
     name:'Red box',
     position: Cesium.Cartesian3.fromDegrees(116.0, 40.0, 300000.0),
     box : {
       dimensions : new Cesium.Cartesian3(400000.0,400000.0,500000.0),
       material : Cesium.Color.RED
     }
  	 });

结果如下:在这里插入图片描述

3、设置视角:

①由默认视角飞行到实体

viewer.flyTo(wplane);

②视角定位实体

viewer.zoomTo(redEllipse);

③设置俯仰角和视角高度

 var heading = Cesium.Math.toRadians(90);
 var pitch = Cesium.Math.toRadians(-50);

4、更多实体

图片中列举了一些CesiumJS可以添加的实体,具体实现参考文档:
API文档之Entity方法
在这里插入图片描述

发布了5 篇原创文章 · 获赞 2 · 访问量 100

猜你喜欢

转载自blog.csdn.net/weixin_40289902/article/details/104464448
03-