# LabelGraphics

vc-graphics-label 组件用于加载二维标签文本。需要作为 vc-entity 的子组件使用。

# 示例

# 加载标签

# 预览

收起
  <template>
    <div class="viewer">
      <vc-viewer @ready="ready">
        <vc-entity :position="position1" :description="description" :label.sync="label1">
          <vc-graphics-label :text="description" font="20px sans-serif" :pixelOffset="pixelOffset1"></vc-graphics-label>
        </vc-entity>
      </vc-viewer>
    </div>
  </template>

  <script>
    export default {
      data () {
        return {
          description: 'Hello GisEye',
          label1: {},
          pixelOffset1: { x: 0.0, y: 20},
          position1: { lng: 114.0, lat: 40.0, height: 300000.0 }
        }
      },
      methods: {
        ready (cesiumInstance) {
          const {Cesium, viewer} = cesiumInstance
        }
      }
    }
  </script>

# 属性

属性名 类型 默认值 描述
show Boolean true optional 指定 label 是否显示。
text String optional 指定 label 文字,支持'\n'换行符。
font String '30px sans-serif' optional 指定 label CSS 字体。
labelStyle Number 0 optional 指定 label 绘制风格。FILL: 0, OUTLINE: 1, FILL_AND_OUTLINE: 2
scale Number 1.0 optional 指定 label 缩放比例。
showBackground Boolean false optional 指定 label 是否显示背景。
backgroundColor Object|String|Array [0.165, 0.165, 0.165, 0.8] optional 指定 label 背景颜色。
backgroundPadding Object {x: 7, y: 5} optional 指定 label 背景偏移量。
pixelOffset Object {x: 0, y: 0} optional 指定 label 像素偏移量。 结构:{ x: number, y: number }
eyeOffset Object {x: 0, y: 0, z: 0} optional 指定 label 视角偏移量。 结构:{ x: number, y: number, z: number }
horizontalOrigin Number 0 optional 指定 label 水平对齐方式。CENTER: 0, LEFT: 1, RIGHT: -1
verticalOrigin Number 0 optional 指定 label 垂直对齐方式。CENTER: 0, BOTTOM: 1, BASELINE: 2, TOP: -1
heightReference Number 0 optional 指定 label 高度模式。NONE: 0, CLAMP_TO_GROUND: 1, RELATIVE_TO_GROUND: 2
fillColor Object|String|Array white optional 指定 label 填充颜色。
outlineColor Object|String|Array black optional 指定 label 轮廓线颜色。
outlineWidth Number 1.0 optional 指定 label 轮廓线宽度。
translucencyByDistance Object optional 指定 label 透明度随相机距离改变的参数。结构:{ near: number, nearValue: number, far: number, farValue: number }
pixelOffsetScaleByDistance Object optional 指定 label 偏移量随相机距离改变的参数。结构:{ near: number, nearValue: number, far: number, farValue: number }
scaleByDistance Object optional 指定 label 缩放随相机距离改变的参数。结构:{ near: number, nearValue: number, far: number, farValue: number }
distanceDisplayCondition Object optional 指定 label 相机距离的显示条件。结构:{ near: number, far: number }
disableDepthTestDistance Number optional 指定 label 的深度测试距离。

# 事件

事件名 参数 描述
ready {Cesium, viewer, cesiumObject} 该组件渲染完毕时触发,返回 Cesium 类, viewer 实例,以及当前组件的 cesiumObject。
definitionChanged 每当更改或修改属性或子属性时触发该事件。