qd-changjing/public/static/Build/Documentation/Label.html

2376 lines
81 KiB
HTML
Raw Normal View History

2022-07-05 16:56:29 +08:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Label - Cesium Documentation</title>
<!--[if lt IE 9]>
<script src="javascript/html5.js"></script>
<![endif]-->
<link href="styles/jsdoc-default.css" rel="stylesheet">
<link href="styles/prism.css" rel="stylesheet">
</head>
<body>
<div id="main">
<h1 class="page-title">
<a href="index.html"><img src="Images/CesiumLogo.png" class="cesiumLogo"></a>
Label
<div class="titleCenterer"></div>
</h1>
<section>
<header>
</header>
<article>
<div class="container-overview">
<div class="nameContainer">
<h4 class="name" id="Label">
<a href="#Label" class="doc-link"></a>
new Cesium.Label<span class="signature">()</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L105">Scene/Label.js 105</a>
</div>
</h4>
</div>
<div class="description">
A Label draws viewport-aligned text positioned in the 3D scene. This constructor
should not be used directly, instead create labels by calling <a href="LabelCollection.html#add"><code>LabelCollection#add</code></a>.
</div>
<h5>Throws:</h5>
<ul>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: translucencyByDistance.far must be greater than translucencyByDistance.near
</div>
</li>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: pixelOffsetScaleByDistance.far must be greater than pixelOffsetScaleByDistance.near
</div>
</li>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: distanceDisplayCondition.far must be greater than distanceDisplayCondition.near
</div>
</li>
</ul>
<dl class="details">
<h5>Demo:</h5>
<ul class="see-list">
<li><a href="https://sandcastle.cesium.com/index.html?src=Labels.html">Cesium Sandcastle Labels Demo</a></li>
</ul>
<h5>See:</h5>
<ul class="see-list">
<li><a href="LabelCollection.html">LabelCollection</a></li>
<li><a href="LabelCollection.html#add">LabelCollection#add</a></li>
</ul>
</dl>
</div>
<h3 class="subsection-title">Members</h3>
<div class="nameContainer">
<h4 class="name" id=".enableRightToLeftDetection">
<a href="#.enableRightToLeftDetection" class="doc-link"></a>
<span class="type-signature attribute-static">static</span> Cesium.Label.enableRightToLeftDetection<span class="type-signature"> : Boolean</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1402">Scene/Label.js 1402</a>
</div>
</h4>
</div>
<div class="description">
Determines whether or not run the algorithm, that match the text of the label to right-to-left languages
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">false</code>
<h5>Examples:</h5>
<pre><code class="language-javascript">// Example 1.
// Set a label's rightToLeft before init
Cesium.Label.enableRightToLeftDetection = true;
const myLabelEntity = viewer.entities.add({
label: {
id: 'my label',
text: 'זה טקסט בעברית \n ועכשיו יורדים שורה',
}
});</code></pre>
<pre><code class="language-javascript">// Example 2.
const myLabelEntity = viewer.entities.add({
label: {
id: 'my label',
text: 'English text'
}
});
// Set a label's rightToLeft after init
Cesium.Label.enableRightToLeftDetection = true;
myLabelEntity.text = 'טקסט חדש';</code></pre>
</dl>
<div class="nameContainer">
<h4 class="name" id="backgroundColor">
<a href="#backgroundColor" class="doc-link"></a>
backgroundColor<span class="type-signature"> : <a href="Color.html">Color</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L512">Scene/Label.js 512</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the background color of this label.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">new Color(0.165, 0.165, 0.165, 0.8)</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="backgroundPadding">
<a href="#backgroundPadding" class="doc-link"></a>
backgroundPadding<span class="type-signature"> : <a href="Cartesian2.html">Cartesian2</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L542">Scene/Label.js 542</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the background padding, in pixels, of this label. The <code>x</code> value
controls horizontal padding, and the <code>y</code> value controls vertical padding.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">new Cartesian2(7, 5)</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="disableDepthTestDistance">
<a href="#disableDepthTestDistance" class="doc-link"></a>
disableDepthTestDistance<span class="type-signature"> : Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1040">Scene/Label.js 1040</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the distance from the camera at which to disable the depth test to, for example, prevent clipping against terrain.
When set to zero, the depth test is always applied. When set to Number.POSITIVE_INFINITY, the depth test is never applied.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="distanceDisplayCondition">
<a href="#distanceDisplayCondition" class="doc-link"></a>
distanceDisplayCondition<span class="type-signature"> : <a href="DistanceDisplayCondition.html">DistanceDisplayCondition</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1001">Scene/Label.js 1001</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the condition specifying at what distance from the camera that this label will be displayed.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">undefined</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="eyeOffset">
<a href="#eyeOffset" class="doc-link"></a>
eyeOffset<span class="type-signature"> : <a href="Cartesian3.html">Cartesian3</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L824">Scene/Label.js 824</a>
</div>
</h4>
</div>
<div class="description">
Gets and sets the 3D Cartesian offset applied to this label in eye coordinates. Eye coordinates is a left-handed
coordinate system, where <code>x</code> points towards the viewer's right, <code>y</code> points up, and
<code>z</code> points into the screen. Eye coordinates use the same scale as world and model coordinates,
which is typically meters.
<br /><br />
An eye offset is commonly used to arrange multiple label or objects at the same position, e.g., to
arrange a label above its corresponding 3D model.
<br /><br />
Below, the label is positioned at the center of the Earth but an eye offset makes it always
appear on top of the Earth regardless of the viewer's or Earth's orientation.
<br /><br />
<div align='center'>
<table border='0' cellpadding='5'><tr>
<td align='center'><img src='Images/Billboard.setEyeOffset.one.png' width='250' height='188' /></td>
<td align='center'><img src='Images/Billboard.setEyeOffset.two.png' width='250' height='188' /></td>
</tr></table>
<code>l.eyeOffset = new Cartesian3(0.0, 8000000.0, 0.0);</code><br /><br />
</div>
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">Cartesian3.ZERO</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="fillColor">
<a href="#fillColor" class="doc-link"></a>
fillColor<span class="type-signature"> : <a href="Color.html">Color</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L412">Scene/Label.js 412</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the fill color of this label.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">Color.WHITE</code>
<h5>See:</h5>
<ul class="see-list">
<li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#fill-and-stroke-styles">HTML canvas 2D context fill and stroke styles</a></li>
</ul>
</dl>
<div class="nameContainer">
<h4 class="name" id="font">
<a href="#font" class="doc-link"></a>
font<span class="type-signature"> : String</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L386">Scene/Label.js 386</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the font used to draw this label. Fonts are specified using the same syntax as the CSS 'font' property.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">'30px sans-serif'</code>
<h5>See:</h5>
<ul class="see-list">
<li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#text-styles">HTML canvas 2D context text styles</a></li>
</ul>
</dl>
<div class="nameContainer">
<h4 class="name" id="heightReference">
<a href="#heightReference" class="doc-link"></a>
heightReference<span class="type-signature"> : <a href="global.html#HeightReference">HeightReference</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L317">Scene/Label.js 317</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the height reference of this billboard.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">HeightReference.NONE</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="horizontalOrigin">
<a href="#horizontalOrigin" class="doc-link"></a>
horizontalOrigin<span class="type-signature"> : <a href="global.html#HorizontalOrigin">HorizontalOrigin</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L869">Scene/Label.js 869</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the horizontal origin of this label, which determines if the label is drawn
to the left, center, or right of its anchor position.
<br /><br />
<div align='center'>
<img src='Images/Billboard.setHorizontalOrigin.png' width='648' height='196' /><br />
</div>
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">HorizontalOrigin.LEFT</code>
<h5>Example:</h5>
<pre><code class="language-javascript">// Use a top, right origin
l.horizontalOrigin = Cesium.HorizontalOrigin.RIGHT;
l.verticalOrigin = Cesium.VerticalOrigin.TOP;</code></pre>
</dl>
<div class="nameContainer">
<h4 class="name" id="id">
<a href="#id" class="doc-link"></a>
id<span class="type-signature"> : *</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1075">Scene/Label.js 1075</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the user-defined value returned when the label is picked.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="outlineColor">
<a href="#outlineColor" class="doc-link"></a>
outlineColor<span class="type-signature"> : <a href="Color.html">Color</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L438">Scene/Label.js 438</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the outline color of this label.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">Color.BLACK</code>
<h5>See:</h5>
<ul class="see-list">
<li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#fill-and-stroke-styles">HTML canvas 2D context fill and stroke styles</a></li>
</ul>
</dl>
<div class="nameContainer">
<h4 class="name" id="outlineWidth">
<a href="#outlineWidth" class="doc-link"></a>
outlineWidth<span class="type-signature"> : Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L464">Scene/Label.js 464</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the outline width of this label.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">1.0</code>
<h5>See:</h5>
<ul class="see-list">
<li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#fill-and-stroke-styles">HTML canvas 2D context fill and stroke styles</a></li>
</ul>
</dl>
<div class="nameContainer">
<h4 class="name" id="pixelOffset">
<a href="#pixelOffset" class="doc-link"></a>
pixelOffset<span class="type-signature"> : <a href="Cartesian2.html">Cartesian2</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L602">Scene/Label.js 602</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the pixel offset in screen space from the origin of this label. This is commonly used
to align multiple labels and billboards at the same position, e.g., an image and text. The
screen space origin is the top, left corner of the canvas; <code>x</code> increases from
left to right, and <code>y</code> increases from top to bottom.
<br /><br />
<div align='center'>
<table border='0' cellpadding='5'><tr>
<td align='center'><code>default</code><br/><img src='Images/Label.setPixelOffset.default.png' width='250' height='188' /></td>
<td align='center'><code>l.pixeloffset = new Cartesian2(25, 75);</code><br/><img src='Images/Label.setPixelOffset.x50y-25.png' width='250' height='188' /></td>
</tr></table>
The label's origin is indicated by the yellow point.
</div>
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">Cartesian2.ZERO</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="pixelOffsetScaleByDistance">
<a href="#pixelOffsetScaleByDistance" class="doc-link"></a>
pixelOffsetScaleByDistance<span class="type-signature"> : <a href="NearFarScalar.html">NearFarScalar</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L712">Scene/Label.js 712</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets near and far pixel offset scaling properties of a Label based on the Label's distance from the camera.
A label's pixel offset will be scaled between the <a href="NearFarScalar.html#nearValue"><code>NearFarScalar#nearValue</code></a> and
<a href="NearFarScalar.html#farValue"><code>NearFarScalar#farValue</code></a> while the camera distance falls within the lower and upper bounds
of the specified <a href="NearFarScalar.html#near"><code>NearFarScalar#near</code></a> and <a href="NearFarScalar.html#far"><code>NearFarScalar#far</code></a>.
Outside of these ranges the label's pixel offset scaling remains clamped to the nearest bound. If undefined,
pixelOffsetScaleByDistance will be disabled.
</div>
<dl class="details">
<h5>Examples:</h5>
<pre><code class="language-javascript">// Example 1.
// Set a label's pixel offset scale to 0.0 when the
// camera is 1500 meters from the label and scale pixel offset to 10.0 pixels
// in the y direction the camera distance approaches 8.0e6 meters.
text.pixelOffset = new Cesium.Cartesian2(0.0, 1.0);
text.pixelOffsetScaleByDistance = new Cesium.NearFarScalar(1.5e2, 0.0, 8.0e6, 10.0);</code></pre>
<pre><code class="language-javascript">// Example 2.
// disable pixel offset by distance
text.pixelOffsetScaleByDistance = undefined;</code></pre>
</dl>
<div class="nameContainer">
<h4 class="name" id="position">
<a href="#position" class="doc-link"></a>
position<span class="type-signature"> : <a href="Cartesian3.html">Cartesian3</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L279">Scene/Label.js 279</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the Cartesian position of this label.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="scale">
<a href="#scale" class="doc-link"></a>
scale<span class="type-signature"> : Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L951">Scene/Label.js 951</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the uniform scale that is multiplied with the label's size in pixels.
A scale of <code>1.0</code> does not change the size of the label; a scale greater than
<code>1.0</code> enlarges the label; a positive scale less than <code>1.0</code> shrinks
the label.
<br /><br />
Applying a large scale value may pixelate the label. To make text larger without pixelation,
use a larger font size when calling <a href="Label.html#font"><code>Label#font</code></a> instead.
<br /><br />
<div align='center'>
<img src='Images/Label.setScale.png' width='400' height='300' /><br/>
From left to right in the above image, the scales are <code>0.5</code>, <code>1.0</code>,
and <code>2.0</code>.
</div>
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">1.0</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="scaleByDistance">
<a href="#scaleByDistance" class="doc-link"></a>
scaleByDistance<span class="type-signature"> : <a href="NearFarScalar.html">NearFarScalar</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L769">Scene/Label.js 769</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets near and far scaling properties of a Label based on the label's distance from the camera.
A label's scale will interpolate between the <a href="NearFarScalar.html#nearValue"><code>NearFarScalar#nearValue</code></a> and
<a href="NearFarScalar.html#farValue"><code>NearFarScalar#farValue</code></a> while the camera distance falls within the lower and upper bounds
of the specified <a href="NearFarScalar.html#near"><code>NearFarScalar#near</code></a> and <a href="NearFarScalar.html#far"><code>NearFarScalar#far</code></a>.
Outside of these ranges the label's scale remains clamped to the nearest bound. If undefined,
scaleByDistance will be disabled.
</div>
<dl class="details">
<h5>Examples:</h5>
<pre><code class="language-javascript">// Example 1.
// Set a label's scaleByDistance to scale by 1.5 when the
// camera is 1500 meters from the label and disappear as
// the camera distance approaches 8.0e6 meters.
label.scaleByDistance = new Cesium.NearFarScalar(1.5e2, 1.5, 8.0e6, 0.0);</code></pre>
<pre><code class="language-javascript">// Example 2.
// disable scaling by distance
label.scaleByDistance = undefined;</code></pre>
</dl>
<div class="nameContainer">
<h4 class="name" id="show">
<a href="#show" class="doc-link"></a>
show<span class="type-signature"> : Boolean</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L245">Scene/Label.js 245</a>
</div>
</h4>
</div>
<div class="description">
Determines if this label will be shown. Use this to hide or show a label, instead
of removing it and re-adding it to the collection.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">true</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="showBackground">
<a href="#showBackground" class="doc-link"></a>
showBackground<span class="type-signature"> : Boolean</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L488">Scene/Label.js 488</a>
</div>
</h4>
</div>
<div class="description">
Determines if a background behind this label will be shown.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">false</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="style">
<a href="#style" class="doc-link"></a>
style<span class="type-signature"> : <a href="global.html#LabelStyle">LabelStyle</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L567">Scene/Label.js 567</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the style of this label.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">LabelStyle.FILL</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="text">
<a href="#text" class="doc-link"></a>
text<span class="type-signature"> : String</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L355">Scene/Label.js 355</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the text of this label.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="totalScale">
<a href="#totalScale" class="doc-link"></a>
totalScale<span class="type-signature"> : Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L989">Scene/Label.js 989</a>
</div>
</h4>
</div>
<div class="description">
Gets the total scale of the label, which is the label's scale multiplied by the computed relative size
of the desired font compared to the generated glyph size.
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">1.0</code>
</dl>
<div class="nameContainer">
<h4 class="name" id="translucencyByDistance">
<a href="#translucencyByDistance" class="doc-link"></a>
translucencyByDistance<span class="type-signature"> : <a href="NearFarScalar.html">NearFarScalar</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L654">Scene/Label.js 654</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets near and far translucency properties of a Label based on the Label's distance from the camera.
A label's translucency will interpolate between the <a href="NearFarScalar.html#nearValue"><code>NearFarScalar#nearValue</code></a> and
<a href="NearFarScalar.html#farValue"><code>NearFarScalar#farValue</code></a> while the camera distance falls within the lower and upper bounds
of the specified <a href="NearFarScalar.html#near"><code>NearFarScalar#near</code></a> and <a href="NearFarScalar.html#far"><code>NearFarScalar#far</code></a>.
Outside of these ranges the label's translucency remains clamped to the nearest bound. If undefined,
translucencyByDistance will be disabled.
</div>
<dl class="details">
<h5>Examples:</h5>
<pre><code class="language-javascript">// Example 1.
// Set a label's translucencyByDistance to 1.0 when the
// camera is 1500 meters from the label and disappear as
// the camera distance approaches 8.0e6 meters.
text.translucencyByDistance = new Cesium.NearFarScalar(1.5e2, 1.0, 8.0e6, 0.0);</code></pre>
<pre><code class="language-javascript">// Example 2.
// disable translucency by distance
text.translucencyByDistance = undefined;</code></pre>
</dl>
<div class="nameContainer">
<h4 class="name" id="verticalOrigin">
<a href="#verticalOrigin" class="doc-link"></a>
verticalOrigin<span class="type-signature"> : <a href="global.html#VerticalOrigin">VerticalOrigin</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L902">Scene/Label.js 902</a>
</div>
</h4>
</div>
<div class="description">
Gets or sets the vertical origin of this label, which determines if the label is
to the above, below, or at the center of its anchor position.
<br /><br />
<div align='center'>
<img src='Images/Billboard.setVerticalOrigin.png' width='695' height='175' /><br />
</div>
</div>
<dl class="details">
<span class="details-header">Default Value:</span>
<code class="language-javascript">VerticalOrigin.BASELINE</code>
<h5>Example:</h5>
<pre><code class="language-javascript">// Use a top, right origin
l.horizontalOrigin = Cesium.HorizontalOrigin.RIGHT;
l.verticalOrigin = Cesium.VerticalOrigin.TOP;</code></pre>
</dl>
<h3 class="subsection-title">Methods</h3>
<div class="nameContainer">
<h4 class="name" id="computeScreenSpacePosition">
<a href="#computeScreenSpacePosition" class="doc-link"></a>
computeScreenSpacePosition<span class="signature">(scene, <span class="optional">result</span>)</span> &rarr; <span class="type-signature returnType"><a href="Cartesian2.html">Cartesian2</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1193">Scene/Label.js 1193</a>
</div>
</h4>
</div>
<div class="description">
Computes the screen-space position of the label's origin, taking into account eye and pixel offsets.
The screen space origin is the top, left corner of the canvas; <code>x</code> increases from
left to right, and <code>y</code> increases from top to bottom.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>scene</code></td>
<td class="type">
<span class="param-type"><a href="Scene.html">Scene</a></span>
</td>
<td class="description last">
The scene the label is in.</td>
</tr>
<tr>
<td class="name"><code>result</code></td>
<td class="type">
<span class="param-type"><a href="Cartesian2.html">Cartesian2</a></span>
</td>
<td class="description last">
<span class="optional">optional</span>
The object onto which to store the result.</td>
</tr>
</tbody>
</table>
<h5>Returns:</h5>
<div class="param-desc">
The screen-space position of the label.
</div>
<dl class="details">
<h5>Example:</h5>
<pre><code class="language-javascript">console.log(l.computeScreenSpacePosition(scene).toString());</code></pre>
<h5>See:</h5>
<ul class="see-list">
<li><a href="Label.html#eyeOffset">Label#eyeOffset</a></li>
<li><a href="Label.html#pixelOffset">Label#pixelOffset</a></li>
</ul>
</dl>
<div class="nameContainer">
<h4 class="name" id="equals">
<a href="#equals" class="doc-link"></a>
equals<span class="signature">(other)</span> &rarr; <span class="type-signature returnType">Boolean</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1322">Scene/Label.js 1322</a>
</div>
</h4>
</div>
<div class="description">
Determines if this label equals another label. Labels are equal if all their properties
are equal. Labels in different collections can be equal.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>other</code></td>
<td class="type">
<span class="param-type"><a href="Label.html">Label</a></span>
</td>
<td class="description last">
The label to compare for equality.</td>
</tr>
</tbody>
</table>
<h5>Returns:</h5>
<div class="param-desc">
<code>true</code> if the labels are equal; otherwise, <code>false</code>.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="isDestroyed">
<a href="#isDestroyed" class="doc-link"></a>
isDestroyed<span class="signature">()</span> &rarr; <span class="type-signature returnType">Boolean</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Scene/Label.js#L1369">Scene/Label.js 1369</a>
</div>
</h4>
</div>
<div class="description">
Returns true if this object was destroyed; otherwise, false.
<br /><br />
If this object was destroyed, it should not be used; calling any function other than
<code>isDestroyed</code> will result in a <a href="DeveloperError.html"><code>DeveloperError</code></a> exception.
</div>
<h5>Returns:</h5>
<div class="param-desc">
True if this object was destroyed; otherwise, false.
</div>
<dl class="details">
</dl>
</article>
</section>
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a>
</footer>
</div>
<div class="nav">
<div class="menu">
<input type="text" class="classFilter" id="ClassFilter" placeholder="Search">
<ul id="ClassList"><li data-name="Animation"><a href="Animation.html">Animation</a></li><li data-name="AnimationViewModel"><a href="AnimationViewModel.html">AnimationViewModel</a></li><li data-name="Appearance"><a href="Appearance.html">Appearance</a></li><li data-name="ArcGisMapServerImageryProvider"><a href="ArcGisMapServerImageryProvider.html">ArcGisMapServerImageryProvider</a></li><li data-name="ArcGISTiledElevationTerrainProvider"><a href="ArcGISTiledElevationTerrainProvider.html">ArcGISTiledElevationTerrainProvider</a></li><li data-name="ArcType"><a href="global.html#ArcType">ArcType</a></li><li data-name="AssociativeArray"><a href="AssociativeArray.html">AssociativeArray</a></li><li data-name="Axis"><a href="global.html#Axis">Axis</a></li><li data-name="AxisAlignedBoundingBox"><a href="AxisAlignedBoundingBox.html">AxisAlignedBoundingBox</a></li><li data-name="backFaceCulling"><a href="global.html#backFaceCulling">backFaceCulling</a></li><li data-name="barycentricCoordinates"><a href="global.html#barycentricCoordinates">barycentricCoordinates</a></li><li data-name="BaseLayerPicker"><a href="BaseLayerPicker.html">BaseLayerPicker</a></li><li data-name="BaseLayerPickerViewModel"><a href="BaseLayerPickerViewModel.html">BaseLayerPickerViewModel</a></li><li data-name="Billboard"><a href="Billboard.html">Billboard</a></li><li data-name="BillboardCollection"><a href="BillboardCollection.html">BillboardCollection</a></li><li data-name="BillboardGraphics"><a href="BillboardGraphics.html">BillboardGraphics</a></li><li data-name="BillboardVisualizer"><a href="BillboardVisualizer.html">BillboardVisualizer</a></li><li data-name="binarySearch"><a href="global.html#binarySearch">binarySearch</a></li><li data-name="binarySearchComparator"><a href="global.html#binarySearchComparator">binarySearchComparator</a></li><li data-name="BingMapsGeocoderService"><a href="BingMapsGeocoderService.html">BingMapsGeocoderService</a></li><li data-name="BingMapsImageryProvider"><a href="BingMapsImageryProvider.html">BingMapsImageryProvider</a></li><li data-name="BingMapsStyle"><a href="global.html#BingMapsStyle">BingMapsStyle</a></li><li data-name="BlendEquation"><a href="global.html#BlendEquation">BlendEquation</a></li><li data-name="BlendFunction"><a href="global.html#BlendFunction">BlendFunction</a></li><li data-name="BlendingState"><a href="BlendingState.html">BlendingState</a></li><li data-name="BlendOption"><a href="global.html#BlendOption">BlendOption</a></li><li data-name="BoundingRectangle"><a href="BoundingRectangle.html">BoundingRectangle</a></li><li data-name="BoundingSphere"><a href="BoundingSphere.html">BoundingSphere</a></li><li data-name="boundingSphere"><a href="global.html#boundingSphere">boundingSphere</a></li><li data-name="BoxEmitter"><a href="BoxEmitter.html">BoxEmitter</a></li><li data-name="BoxGeometry"><a href="BoxGeometry.html">BoxGeometry</a></li><li data-name="BoxGeometryUpdater"><a href="BoxGeometryUpdater.html">BoxGeometryUpdater</a></li><li data-name="BoxGraphics"><a href="BoxGraphics.html">BoxGraphics</a></li><li data-name="BoxOutlineGeometry"><a href="BoxOutlineGeometry.html">BoxOutlineGeometry</a></li><li data-name="buildModuleUrl"><a href="global.html#buildModuleUrl">buildModuleUrl</a></li><li data-name="CallbackProperty"><a href="CallbackProperty.html">CallbackProperty</a></li><li data-name="Camera"><a href="Camera.html">Camera</a></li><li data-name="CameraEventAggregator"><a href="CameraEventAggregator.html">CameraEventAggregator</a></li><li data-name="CameraEventType"><a href="global.html#CameraEventType">CameraEventType</a></li><li data-name="cancelAnimationFrame"><a href="global.html#cancelAnimationFrame">cancelAnimationFrame</a></li><li data-name="Cartesian2"><a href="Cartesian2.html">Cartesian2</a></li><li data-name="Cartesian3"><a href="Cartesian3.html">Cartesian3</a></li><li data-name="Cartesian4"><a href="Cartesian4.html">Cartesian4</a></li><li data-name="Cartographic"><a href="Cartographic.html">Cartographic</a></li><li data-name="CartographicGeocoderService"><a href="CartographicGeocoderServic
</div>
</div>
<script>
if (window.frameElement) {
document.body.className = 'embedded';
var ele = document.createElement('a');
ele.className = 'popout';
ele.target = '_blank';
ele.href = window.location.href;
ele.title = 'Pop out';
document.getElementById('main').appendChild(ele);
}
// Set targets on external links. Sandcastle and GitHub shouldn't be embedded in any iframe.
Array.prototype.forEach.call(document.getElementsByTagName('a'), function(a) {
if (/^https?:/i.test(a.getAttribute('href'))) {
a.target='_blank';
}
});
</script>
<script src="javascript/prism.js"></script>
<script src="javascript/cesiumDoc.js"></script>
</body>
</html>