CesiumWidget
.
contextOptions
parameter details:
The default values are:
{
webgl : {
alpha : false,
depth : true,
stencil : false,
antialias : true,
powerPreference: 'high-performance',
premultipliedAlpha : true,
preserveDrawingBuffer : false,
failIfMajorPerformanceCaveat : false
},
allowTextureFilterAnisotropic : true
}
The webgl
property corresponds to the WebGLContextAttributes
object used to create the WebGL context.
webgl.alpha
defaults to false, which can improve performance compared to the standard WebGL default
of true. If an application needs to composite Cesium above other HTML elements using alpha-blending, set
webgl.alpha
to true.
The other webgl
properties match the WebGL defaults for WebGLContextAttributes.
allowTextureFilterAnisotropic
defaults to true, which enables anisotropic texture filtering when the
WebGL extension is supported. Setting this to false will improve performance, but hurt visual quality, especially for horizon views.
Name | Type | Default | Description | ||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
options |
Object |
Object with the following properties:
|
|||||||||||||||||||||||||||||||||||||||||||||||||
depthPlaneEllipsoidOffset |
Number |
0.0
|
optional Adjust the DepthPlane to address rendering artefacts below ellipsoid zero elevation. | ||||||||||||||||||||||||||||||||||||||||||||||||
options.msaaSamples |
Number |
1
|
optional If provided, this value controls the rate of multisample antialiasing. Typical multisampling rates are 2, 4, and sometimes 8 samples per pixel. Higher sampling rates of MSAA may impact performance in exchange for improved visual quality. This value only applies to WebGL2 contexts that support multisample render targets. |
Throws:
-
DeveloperError : options and options.canvas are required.
Example:
// Create scene without anisotropic texture filtering
const scene = new Cesium.Scene({
canvas : canvas,
contextOptions : {
allowTextureFilterAnisotropic : false
}
});
See:
Members
backgroundColor : Color
Scene#skyBox
is undefined.
-
Default Value:
Color.BLACK
See:
readonly camera : Camera
-
Default Value:
false
true
if the Scene#clampToHeight
and Scene#clampToHeightMostDetailed
functions are supported.
-
Default Value:
true
A function that determines what commands are executed. As shown in the examples below,
the function receives the command's owner
as an argument, and returns a boolean indicating if the
command should be executed.
The default is undefined
, indicating that all commands are executed.
-
Default Value:
undefined
Example:
// Do not execute any commands.
scene.debugCommandFilter = function(command) {
return false;
};
// Execute only the billboard's commands. That is, only draw the billboard.
const billboards = new Cesium.BillboardCollection();
scene.debugCommandFilter = function(command) {
return command.owner === billboards;
};
When Scene.debugShowFrustums
is true
, this contains
properties with statistics about the number of command execute per frustum.
totalCommands
is the total number of commands executed, ignoring
overlap. commandsInFrustums
is an array with the number of times
commands are executed redundantly, e.g., how many commands overlap two or
three frustums.
-
Default Value:
undefined
When true
, commands are randomly shaded. This is useful
for performance analysis to see what parts of a scene or model are
command-dense and could benefit from batching.
-
Default Value:
false
Indicates which frustum will have depth information displayed.
-
Default Value:
1
Displays frames per second and time between frames.
-
Default Value:
false
When true
, draws outlines to show the boundaries of the camera frustums
-
Default Value:
false
When true
, commands are shaded based on the frustums they
overlap. Commands in the closest frustum are tinted red, commands in
the next closest are green, and commands in the farthest frustum are
blue. If a command overlaps more than one frustum, the color components
are combined, e.g., a command overlapping the first two frustums is tinted
yellow.
-
Default Value:
false
See:
See:
This value is used to create the near and far values for each frustum of the multi-frustum. It is only used
when Scene#logarithmicDepthBuffer
is false
. When logarithmicDepthBuffer
is
true
, use Scene#logarithmicDepthFarToNearRatio
.
-
Default Value:
1000.0
fog : Fog
-
Default Value:
2.2
globe : Globe
readonly groundPrimitives : PrimitiveCollection
-
Default Value:
false
-
Default Value:
true
readonly imageryLayers : ImageryLayerCollection
false
, 3D Tiles will render normally. When true
, classified 3D Tile geometry will render normally and
unclassified 3D Tile geometry will render with the color multiplied by Scene#invertClassificationColor
.
-
Default Value:
false
invertClassificationColor : Color
Scene#invertClassification
is true
.
When the color's alpha is less than 1.0, the unclassified portions of the 3D Tiles will not blend correctly with the classified positions of the 3D Tiles.
Also, when the color's alpha is less than 1.0, the WEBGL_depth_texture and EXT_frag_depth WebGL extensions must be supported.
-
Default Value:
Color.WHITE
true
if the Scene#invertClassification
is supported.
readonly lastRenderTime : JulianDate
light : Light
This value is used to create the near and far values for each frustum of the multi-frustum. It is only used
when Scene#logarithmicDepthBuffer
is true
. When logarithmicDepthBuffer
is
false
, use Scene#farToNearRatio
.
-
Default Value:
1e9
readonly mapMode2D : MapMode2D
readonly mapProjection : MapProjection
-
Default Value:
new GeographicProjection()
- glGet with
ALIASED_LINE_WIDTH_RANGE
.
See:
- glGet with
GL_MAX_CUBE_MAP_TEXTURE_SIZE
.
See:
Scene#requestRenderMode
is true
, this value defines the maximum change in
simulation time allowed before a render is requested. Lower values increase the number of frames rendered
and higher values decrease the number of frames rendered. If undefined
, changes to
the simulation time will never request a render.
This value impacts the rate of rendering for changes in the scene like lighting, entity property updates,
and animations.
-
Default Value:
0.0
See:
-
Default Value:
0.0
mode : SceneMode
-
Default Value:
SceneMode.SCENE3D
moon : Moon
Moon
-
Default Value:
undefined
morphComplete : Event
-
Default Value:
Event()
morphStart : Event
-
Default Value:
Event()
-
Default Value:
1.0
-
Default Value:
1
true
if the Scene's context supports MSAA.
-
Default Value:
1.75e6
true
if the Scene#pickPosition
function is supported.
See:
true
, enables picking translucent geometry using the depth buffer. Note that Scene#useDepthPicking
must also be true for enabling this to work.
There is a decrease in performance when enabled. There are extra draw calls to write depth for translucent geometry.
-
Default Value:
false
Example:
// picking the position of a translucent primitive
viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) {
const pickedFeature = viewer.scene.pick(movement.position);
if (!Cesium.defined(pickedFeature)) {
// nothing picked
return;
}
const worldPosition = viewer.scene.pickPosition(movement.position);
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
postProcessStages : PostProcessStageCollection
readonly postRender : Event
See:
readonly postUpdate : Event
readonly preRender : Event
See:
readonly preUpdate : Event
See:
readonly primitives : PrimitiveCollection
readonly renderError : Event
render
function.
The Scene instance and the thrown error are the only two parameters passed to the event handler.
By default, errors are not rethrown after this event is raised, but that can be changed by setting
the rethrowRenderErrors
property.
true
, rendering a frame will only occur when needed as determined by changes within the scene.
Enabling improves performance of the application, but requires using Scene#requestRender
to render a new frame explicitly in this mode. This will be necessary in many cases after making changes
to the scene in other parts of the API.
-
Default Value:
false
See:
render
are always caught in order to raise the
renderError
event. If this property is true, the error is rethrown
after the event is raised. If this property is false, the render
function
returns normally after raising the event.
-
Default Value:
false
readonly screenSpaceCameraController : ScreenSpaceCameraController
shadowMap : ShadowMap
skyAtmosphere : SkyAtmosphere
-
Default Value:
undefined
skyBox : SkyBox
SkyBox
used to draw the stars.
-
Default Value:
undefined
See:
true
if specular environment maps are supported.
sphericalHarmonicCoefficients : Array.<Cartesian3>
sun : Sun
Sun
.
-
Default Value:
undefined
-
Default Value:
true
terrainProvider : TerrainProvider
readonly terrainProviderChanged : Event
true
, enables picking using the depth buffer.
-
Default Value:
true
true
, splits the scene into two viewports with steroscopic views for the left and right eyes.
Used for cardboard and WebVR.
-
Default Value:
false
Methods
cartesianToCanvasCoordinates(position, result) → Cartesian2
Name | Type | Description |
---|---|---|
position |
Cartesian3 | The position in cartesian coordinates. |
result |
Cartesian2 | optional An optional object to return the input position transformed to canvas coordinates. |
Returns:
undefined
if the input position is near the center of the ellipsoid.
Example:
// Output the canvas position of longitude/latitude (0, 0) every time the mouse moves.
const scene = widget.scene;
const ellipsoid = scene.globe.ellipsoid;
const position = Cesium.Cartesian3.fromDegrees(0.0, 0.0);
const handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
handler.setInputAction(function(movement) {
console.log(scene.cartesianToCanvasCoordinates(position));
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
clampToHeight(cartesian, objectsToExclude, width, result) → Cartesian3
undefined
if there was no scene geometry to clamp to. May be used to clamp
objects to the globe, 3D Tiles, or primitives in the scene.
This function only clamps to globe tiles and 3D Tiles that are rendered in the current view. Clamps to all other primitives regardless of their visibility.
Name | Type | Default | Description |
---|---|---|---|
cartesian |
Cartesian3 | The cartesian position. | |
objectsToExclude |
Array.<Object> | optional A list of primitives, entities, or 3D Tiles features to not clamp to. | |
width |
Number |
0.1
|
optional Width of the intersection volume in meters. |
result |
Cartesian3 | optional An optional object to return the clamped position. |
Returns:
undefined
if there was no scene geometry to clamp to.
Throws:
-
DeveloperError : clampToHeight is only supported in 3D mode.
-
DeveloperError : clampToHeight requires depth texture support. Check clampToHeightSupported.
Example:
// Clamp an entity to the underlying scene geometry
const position = entity.position.getValue(Cesium.JulianDate.now());
entity.position = viewer.scene.clampToHeight(position);
See:
clampToHeightMostDetailed(cartesians, objectsToExclude, width) → Promise.<Array.<Cartesian3>>
Scene#clampToHeight
query for an array of Cartesian3
positions
using the maximum level of detail for 3D Tilesets in the scene. Returns a promise that is resolved when
the query completes. Each position is modified in place. If a position cannot be clamped because no geometry
can be sampled at that location, or another error occurs, the element in the array is set to undefined.
Name | Type | Default | Description |
---|---|---|---|
cartesians |
Array.<Cartesian3> | The cartesian positions to update with clamped positions. | |
objectsToExclude |
Array.<Object> | optional A list of primitives, entities, or 3D Tiles features to not clamp to. | |
width |
Number |
0.1
|
optional Width of the intersection volume in meters. |
Returns:
Throws:
-
DeveloperError : clampToHeightMostDetailed is only supported in 3D mode.
-
DeveloperError : clampToHeightMostDetailed requires depth texture support. Check clampToHeightSupported.
Example:
const cartesians = [
entities[0].position.getValue(Cesium.JulianDate.now()),
entities[1].position.getValue(Cesium.JulianDate.now())
];
const promise = viewer.scene.clampToHeightMostDetailed(cartesians);
promise.then(function(updatedCartesians) {
entities[0].position = updatedCartesians[0];
entities[1].position = updatedCartesians[1];
}
See:
Once an object is destroyed, it should not be used; calling any function other than
isDestroyed
will result in a DeveloperError
exception. Therefore,
assign the return value (undefined
) to the object as done in the example.
Throws:
-
DeveloperError : This object was destroyed, i.e., destroy() was called.
Example:
scene = scene && scene.destroy();
See:
Name | Type | Default | Description |
---|---|---|---|
windowPosition |
Cartesian2 | Window coordinates to perform picking on. | |
limit |
Number | optional If supplied, stop drilling after collecting this many picks. | |
width |
Number |
3
|
optional Width of the pick rectangle. |
height |
Number |
3
|
optional Height of the pick rectangle. |
Returns:
Throws:
-
DeveloperError : windowPosition is undefined.
Example:
const pickedObjects = scene.drillPick(new Cesium.Cartesian2(100.0, 200.0));
See:
Name | Type | Description |
---|---|---|
format |
String | The texture format. May be the name of the format or the WebGL extension name, e.g. s3tc or WEBGL_compressed_texture_s3tc. |
Returns:
If this object was destroyed, it should not be used; calling any function other than
isDestroyed
will result in a DeveloperError
exception.
Returns:
true
if this object was destroyed; otherwise, false
.
See:
Name | Type | Default | Description |
---|---|---|---|
duration |
Number |
2.0
|
optional The amount of time, in seconds, for transition animations to complete. |
Name | Type | Default | Description |
---|---|---|---|
duration |
Number |
2.0
|
optional The amount of time, in seconds, for transition animations to complete. |
Name | Type | Default | Description |
---|---|---|---|
duration |
Number |
2.0
|
optional The amount of time, in seconds, for transition animations to complete. |
When a feature of a 3D Tiles tileset is picked, pick
returns a Cesium3DTileFeature
object.
Name | Type | Default | Description |
---|---|---|---|
windowPosition |
Cartesian2 | Window coordinates to perform picking on. | |
width |
Number |
3
|
optional Width of the pick rectangle. |
height |
Number |
3
|
optional Height of the pick rectangle. |
Returns:
Example:
// On mouse over, color the feature yellow.
handler.setInputAction(function(movement) {
const feature = scene.pick(movement.endPosition);
if (feature instanceof Cesium.Cesium3DTileFeature) {
feature.color = Cesium.Color.YELLOW;
}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
pickPosition(windowPosition, result) → Cartesian3
The position reconstructed from the depth buffer in 2D may be slightly different from those reconstructed in 3D and Columbus view. This is caused by the difference in the distribution of depth values of perspective and orthographic projection.
Set Scene#pickTranslucentDepth
to true
to include the depth of
translucent primitives; otherwise, this essentially picks through translucent primitives.
Name | Type | Description |
---|---|---|
windowPosition |
Cartesian2 | Window coordinates to perform picking on. |
result |
Cartesian3 | optional The object on which to restore the result. |
Returns:
Throws:
-
DeveloperError : Picking from the depth buffer is not supported. Check pickPositionSupported.
CesiumWidget
or Viewer
do it automatically.
Name | Type | Description |
---|---|---|
time |
JulianDate | optional The simulation time at which to render. |
Scene#requestRenderMode
is set to true
.
The render rate will not exceed the CesiumWidget#targetFrameRate
.
undefined
if there was no
scene geometry to sample height from. The height of the input position is ignored. May be used to clamp objects to
the globe, 3D Tiles, or primitives in the scene.
This function only samples height from globe tiles and 3D Tiles that are rendered in the current view. Samples height from all other primitives regardless of their visibility.
Name | Type | Default | Description |
---|---|---|---|
position |
Cartographic | The cartographic position to sample height from. | |
objectsToExclude |
Array.<Object> | optional A list of primitives, entities, or 3D Tiles features to not sample height from. | |
width |
Number |
0.1
|
optional Width of the intersection volume in meters. |
Returns:
undefined
if there was no scene geometry to sample height from.
Throws:
-
DeveloperError : sampleHeight is only supported in 3D mode.
-
DeveloperError : sampleHeight requires depth texture support. Check sampleHeightSupported.
Example:
const position = new Cesium.Cartographic(-1.31968, 0.698874);
const height = viewer.scene.sampleHeight(position);
console.log(height);
See:
sampleHeightMostDetailed(positions, objectsToExclude, width) → Promise.<Array.<Cartographic>>
Scene#sampleHeight
query for an array of Cartographic
positions
using the maximum level of detail for 3D Tilesets in the scene. The height of the input positions is ignored.
Returns a promise that is resolved when the query completes. Each point height is modified in place.
If a height cannot be determined because no geometry can be sampled at that location, or another error occurs,
the height is set to undefined.
Name | Type | Default | Description |
---|---|---|---|
positions |
Array.<Cartographic> | The cartographic positions to update with sampled heights. | |
objectsToExclude |
Array.<Object> | optional A list of primitives, entities, or 3D Tiles features to not sample height from. | |
width |
Number |
0.1
|
optional Width of the intersection volume in meters. |
Returns:
Throws:
-
DeveloperError : sampleHeightMostDetailed is only supported in 3D mode.
-
DeveloperError : sampleHeightMostDetailed requires depth texture support. Check sampleHeightSupported.
Example:
const positions = [
new Cesium.Cartographic(-1.31968, 0.69887),
new Cesium.Cartographic(-1.10489, 0.83923)
];
const promise = viewer.scene.sampleHeightMostDetailed(positions);
promise.then(function(updatedPosition) {
// positions[0].height and positions[1].height have been updated.
// updatedPositions is just a reference to positions.
}