使用Cesium JS改变标签的偏移量

Change offset of label using Cesium JS

本文关键字:偏移量 标签 改变 Cesium JS 使用      更新时间:2023-09-26

我想在铯中拖动一个标签(或标签集合)而不改变其位置。我想在创建标签后改变它的pixelOffset。我这样做了:

            var entity = mapa.getViewer.entities.add({
            position: Cesium.Cartesian3.fromDegrees(-75.1641667, 39.9522222),
            billboard: {
                image: pinBuilder.fromColor(Cesium.Color.SALMON, 48),
                verticalOrigin: Cesium.VerticalOrigin.BOTTOM
            },
            label: {
                text: ' Ponto',
                verticalOrigin: Cesium.VerticalOrigin.TOP,
                horizontalOrigin: Cesium.HorizontalOrigin.RIGHT,
                font: '20px Helvetica',
                fillColor: Cesium.Color.WHITE,
                outlineWidth: 1,
                style: Cesium.LabelStyle.FILL,
                pixelOffset: new Cesium.Cartesian3(0,0,0)
            }
            });
            //Tried to update the pixelOffset value
            entity.pixelOffset = new Cesium.Cartesian3(200, 20);

但是什么也没发生。我在控制台上记录了实体,出现了pixelOffset的值,但在地图上没有变化。

提前感谢!

你的代码有两个问题。

  1. 最后一行entity.pixelOffset分配错误。应该是entity.label.pixelOffset。这就是你不能工作的主要原因。
  2. LabelGraphics.pixelOffsetCartesian2实例,不是Cartesian3实例。由于JavaScript的动态类型,代码将在任何一种情况下工作,但使用正确的类型是良好的实践,并将帮助浏览器更好地优化代码。

也不需要在创建时设置pixelOffset,因为默认值是Cartesian2.ZERO,创建一个新实例只会浪费内存。

这是你的代码更新后的工作版本:

var entity = mapa.getViewer.entities.add({
    position: Cesium.Cartesian3.fromDegrees(-75.1641667, 39.9522222),
    billboard: {
        image: pinBuilder.fromColor(Cesium.Color.SALMON, 48),
        verticalOrigin: Cesium.VerticalOrigin.BOTTOM
    },
    label: {
        text: ' Ponto',
        verticalOrigin: Cesium.VerticalOrigin.TOP,
        horizontalOrigin: Cesium.HorizontalOrigin.RIGHT,
        font: '20px Helvetica',
        fillColor: Cesium.Color.WHITE,
        outlineWidth: 1,
        style: Cesium.LabelStyle.FILL
    }
});
entity.label.pixelOffset = new Cesium.Cartesian2(200, 20);