cesium 文本标注被遮挡_Cesium中Primitive讲解

前面介绍了entity方式绘制对象,现在我们开始接触primitive方式,primitive方式更接近渲染引擎底层,由于我对webgl知之甚少,因此primitive接口我现在也是一知半解,写这个博客我参考了这一篇博客Cesium(三) 几何图形与外观。(https://blog.csdn.net/happyduoduo1/article/details/51868042)

1、Primitive由两个部分组成

(1)几何形状(Geometry):定义了Primitive的结构,例如三角形、线条、点等

(2)外观(Appearance ):定义Primitive的着色(Sharding),包括GLSL(OpenGL着色语言,OpenGL ShadingLanguage)顶点着色器和片段着色器( vertex and fragment shaders),以及渲染状态(render state)

Cesium支持以下几何图形:

image.png

image.png

image.png

使用Geometry和Appearance 具有以下优势:

(1)性能:绘制大量Primitive时,可以将其合并为单个Geometry以减轻CPU负担、更好的使用GPU。合并Primitive由web worker线程执行,UI保持响应性

(2)灵活性:Geometry与Appearance 解耦,两者可以分别进行修改

(3)低级别访问:易于编写GLSL 顶点、片段着色器、使用自定义的渲染状态

同时,具有以下劣势:

(1)需要编写更多地代码

(2)需要对图形编程有更多的理解,特别是OpenGL的知识

下面代码是entity与primitive方式对比:

//entity方式

viewer.entities.add({

rectangle: {

coordinates: Cesium.Rectangle.fromDegrees(110.20, 34.55, 111.20, 35.55),

material: new Cesium.StripeMaterialProperty({

evenColor: Cesium.Color.WHITE,

oddColor: Cesium.Color.BLUE,

repeat:5

})

}

});

//primitive方式

var instance = new Cesium.GeometryInstance({

geometry: new Cesium.RectangleGeometry({

rectangle: Cesium.Rectangle.fromDegrees(105.20, 30.55, 106.20, 31.55),

vertexFormat:Cesium.EllipsoidSurfaceAppearance.VERTEXT_FORMAT

})

});

viewer.scene.primitives.add(new Cesium.Primitive({

geometryInstances: instance,

appearance: new Cesium.EllipsoidS

你可能感兴趣的:(cesium,文本标注被遮挡)