Billboard

new Cesium.Billboard()

Scene/Billboard.js 54

在3D场景中定位的视口对齐图像，即 并使用BillboardCollection进行渲染。创建了一个广告牌，其初始 属性通过调用BillboardCollection#add设置。

Example billboards

Performance:

读取属性（例如Billboard#show）是恒定时间。 为属性赋值是恒定时间，但会导致 调用BillboardCollection#update时CPU到GPU的流量。每个广告牌的流量是 不管更新了多少属性，都是一样的。如果一个集合中的大多数广告牌需要 更新后，使用BillboardCollection#removeAll清除集合可能更有效 增加新的广告牌，而不是修改每一个。

Throws:

• DeveloperError : 缩放距离.far必须大于scaleByDistance.近
• DeveloperError ：translucencyByDistance.far公司必须大于translucencyByDistance.近
• DeveloperError ：像素ffsetScaleByDistance.far距离必须大于pixelOffsetScaleByDistance.近
• DeveloperError ：距离取消显示条件.far必须大于距离取消显示条件。接近

Demo:

• Cesium Sandcastle Billboard Demo

See:

• BillboardCollection
• BillboardCollection#add
• Label

Members

Examples:

// Example 1.
// Have the billboard up vector point north
billboard.alignedAxis = Cesium.Cartesian3.UNIT_Z;

// Example 2.
// Have the billboard point east.
billboard.alignedAxis = Cesium.Cartesian3.UNIT_Z;
billboard.rotation = -Cesium.Math.PI_OVER_TWO;

// Example 3.
// Reset the aligned axis
billboard.alignedAxis = Cesium.Cartesian3.ZERO;

获取或设置与公告牌纹理相乘的颜色。这有两个常见的用例。第一， 相同的白色纹理可能会被许多不同的广告牌使用，每一个都有不同的颜色，以创造 COLred广告牌。其次，颜色的alpha成分可以用来使广告牌半透明，如下所示。 0.0的alpha使公告牌透明，而1.0使公告牌不透明。

default

alpha : 0.5

红色、green、blue和alpha value由值的红色、绿色表示， 蓝色和alpha属性，如示例1所示。这些部件的范围为0.0 （无强度）至1.0（全强度）。

Examples:

// Example 1. Assign yellow.
b.color = Cesium.Color.YELLOW;

// Example 2. Make a billboard 50% translucent.
b.color = new Cesium.Color(1.0, 1.0, 1.0, 0.5);

Default Value: undefined

获取或设置应用于eye坐标的三维笛卡尔偏移量。眼睛坐标是左手的 坐标系，其中x指向观看者的右侧，y指向上，并且 z指向屏幕。眼睛坐标使用与世界坐标和模型坐标相同的比例， 通常是米。 眼偏移通常用于在同一位置排列多个广告牌或物体，例如 在相应的三维模型上方放置一个广告牌。 下面，广告牌被定位在地球的中心，但眼睛的偏移使它总是 无论观测者或地球的方位如何，都会出现在地球的顶部。

b.eyeOffset = new Cartesian3(0.0, 8000000.0, 0.0);

Default Value: HeightReference.NONE

获取或设置此公告牌的水平原点，它确定公告牌是否 在其锚定位置的左侧、中心或右侧。

Example:

// Use a bottom, left origin
b.horizontalOrigin = Cesium.HorizontalOrigin.LEFT;
b.verticalOrigin = Cesium.VerticalOrigin.BOTTOM;

Example:

// load an image from a URL
b.image = 'some/image/url.png';

// assuming b1 and b2 are billboards in the same billboard collection,
// use the same image for both billboards.
b2.image = b1.image;

获取或设置屏幕空间中距此公告牌原点的pixel偏移量。这是常见的y 在同一位置对齐多个广告牌和标签，如图像和文本。这个 屏幕空间原点是画布的左上角；x从 从右到下，从右到下依次递增。

default

b.pixeloffset = new Cartesian2(50, 25);

The billboard's origin is indicated by the yellow point.

Examples:

// Example 1.
// Set a billboard's pixel offset scale to 0.0 when the
// camera is 1500 meters from the billboard and scale pixel offset to 10.0 pixels
// in the y direction the camera distance approaches 8.0e6 meters.
b.pixelOffset = new Cesium.Cartesian2(0.0, 1.0);
b.pixelOffsetScaleByDistance = new Cesium.NearFarScalar(1.5e2, 0.0, 8.0e6, 10.0);

// Example 2.
// disable pixel offset by distance
b.pixelOffsetScaleByDistance = undefined;

Default Value: false

获取或设置与公告牌的图像大小（以像素为单位）相乘的统一比例。 比例尺1.0不会改变广告牌的大小；比例尺大于 1.0放大广告牌；小于1.0的正比例缩小 广告牌。

From left to right in the above image, the scales are 0.5, 1.0, and 2.0.

Examples:

// Example 1.
// Set a billboard's scaleByDistance to scale by 1.5 when the
// camera is 1500 meters from the billboard and disappear as
// the camera distance approaches 8.0e6 meters.
b.scaleByDistance = new Cesium.NearFarScalar(1.5e2, 1.5, 8.0e6, 0.0);

// Example 2.
// disable scaling by distance
b.scaleByDistance = undefined;

Default Value: true

Default Value: false

Examples:

// Example 1.
// Set a billboard's translucency to 1.0 when the
// camera is 1500 meters from the billboard and disappear as
// the camera distance approaches 8.0e6 meters.
b.translucencyByDistance = new Cesium.NearFarScalar(1.5e2, 1.0, 8.0e6, 0.0);

// Example 2.
// disable translucency by distance
b.translucencyByDistance = undefined;

获取或设置此公告牌的垂直原点，它确定公告牌是否 在其锚位置的上方、下方或中心。

Example:

// Use a bottom, left origin
b.horizontalOrigin = Cesium.HorizontalOrigin.LEFT;
b.verticalOrigin = Cesium.VerticalOrigin.BOTTOM;

Methods

Returns:

Throws:

• DeveloperError ：广告牌必须在集合中。

Example:

console.log(b.computeScreenSpacePosition(scene).toString());

See:

• Billboard#eyeOffset
• Billboard#pixelOffset

Returns:

Example:

// create a billboard image dynamically
function drawImage(id) {
  // create and draw an image using a canvas
  var canvas = document.createElement('canvas');
  var context2D = canvas.getContext('2d');
  // ... draw image
  return canvas;
}
// drawImage will be called to create the texture
b.setImage('myImage', drawImage);

// subsequent billboards created in the same collection using the same id will use the existing
// texture, without the need to create the canvas or draw the image
b2.setImage('myImage', drawImage);

Throws:

• RuntimeError ：带id的图像必须在图集中

Type Definitions

Returns: