Cesium不随球转动的Label

  用Cesium的label加载文字时，文字始终是面向用户这一边，不能很好的控制角度，刚好有个需求需要文字不随球转动，就像二维地图上那种水平的文字一样。

解决方案：

假设文字的坐标为var position = new Cesium.Cartesian3.fromDegrees(x, y, z)

1. Cesium内部有文字转Canvas的方法，Cesium.writeTextToCanvas 我们用这个方法将文字转成canvas,用canvas的宽和高作为放大矩阵

var dimensions = new Cesium.Cartesian3(canvas.width, canvas.height, 1.0);

var scaleM = Cesium.Matrix4.fromScale(dimensions );

2. 先用坐标建立矩阵坐标系, 

var M = Cesium.Transforms.eastNorthUpToFixedFrame(position )

3. 先给一个旋转矩阵，这样就可以对应任意角度

var rotateM3 = Cesium.Matrix3.fromHeadingPitchRoll(Cesium.HeadingPitchRoll.fromDegrees(heading, pitch, roll));

var rotateM4 = Cesium.Matrix4.fromRotationTranslation(rotateM3)

4. 先乘以旋转矩阵再乘以放大矩阵得到最终的矩阵

Cesium.Matrix4.multiply(M，rotateM4 ，M  )

Cesium.Matrix4.multiply(M，scaleM ，M  )

5. 得到矩阵后我们就可以用单位面，矩阵用这个矩阵去放大，材质用canvas就行了

var primitive = new Cesium.Primitve({
    geometryInstances: new Cesium.GeometryInstance({
        geometry: Cesium.PlaneGeometry.createGeometry(
            new Cesium.PlaneGeometry({
                vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT
            })
        ),
        modelMatrix: M
    }),
    appearance: new Cesium.EllipsoidSurfaceAppearance({
        material: Cesium.Material.fromType('Image', {
            image: canvas,
            repeat: new Cesium.Cartesian2(1, 1)
        }),
        flat: true,
        aboveGround: true
    }),
    asynchronous: false
})
scene.primitives.add(primitive)

6.效果图如下

正面和背面