SphereStyle | XYZ Maps Documentation

Interface for configuring the visual appearance of Rectangles.

Hierarchy

SphereStyle

Index

Properties

Optional altitude

The altitude of the style in meters. The altitude defines the distance in the vertical direction between the ground plane at 0 meters and the geometry/style. If altitude is set to true, the altitude from the feature's geometry coordinates will be used automatically. If a number is set for altitude, the altitude of the feature's geometry is ignored and the value of "altitude" is used instead. The height must be defined in meters.

defaultvalue: false
experimental

Optional emissive

emissive: Color | StyleValueFunction<Color> | StyleZoomRange<Color> | StyleExpression<Color>

Sets the emissive color of the "Sphere", giving it a glow effect.

see: Color for a detailed list of possible supported formats.

Optional fill

fill: Color | StyleValueFunction<Color> | StyleZoomRange<Color> | StyleExpression<Color>

Sets the color to fill the Sphere. This attribute is valid for Circle, Rect, Text and Polygon.

see: Color for a detailed list of possible supported formats.

Optional fillIntensity

fillIntensity: number

Controls the intensity of the fill color under directional lighting.

fillIntensity determines how much the "Sphere"'s fill color is affected by the directional lighting in the scene. A higher value increases the intensity of the fill color, making it more vibrant under strong lighting, while a lower value reduces the effect, resulting in a more muted color.

The value should range from 0 to 1, where 0 means no color intensity and 1 represents full intensity.

defaultvalue: 1

Optional light

light: string

Specifies the name of the light group to use for illuminating specific features on a layer. This property must reference a key corresponding to a light group defined in LayerStyle.lights. A light group consists of lighting sources such as ambient or directional lights that affect the appearance of features.

If light is not defined, the default light group "defaultLight" will be used to illuminate the layer's features.

see: LayerStyle.lights for defining and referencing available light groups.
defaultvalue: "defaultLight"

Optional offsetX

Offset the shape in pixels on x-axis. A positive value offsets to the right, a negative value to the left. The default unit is pixels.

example

// offset Sphere by 1m to the left
{ type: "Sphere", zIndex: 0, fill:'blue', radius: 24, offsetX: "-1m"}

Optional offsetY

offsetY: number | StyleValueFunction<number> | StyleZoomRange<number> | StyleExpression<number>

Offset the shape in pixels on y-axis. A positive value offsetY offsets downwards, a negative value upwards. The default unit is pixels.

example

// offset Sphere by 1m to the top
{ type: "Sphere", zIndex: 0, fill:'blue', radius: 24, offsetY: "-1m"}

Optional offsetZ

Offset the shape in pixels on z-axis. A positive value offsets up, a negative value down. The default unit is pixels.

example

// offset Sphere by 1m to the top
{ type: "Sphere", zIndex: 0, fill:'blue', radius: 24, offsetZ: "1m"}

Optional opacity

opacity: number | StyleValueFunction<number> | StyleZoomRange<number> | StyleExpression<number>

Defines the opacity of the style. The value must be between 0.0 (fully transparent) and 1.0 (fully opaque). It is valid for all style types.

defaultvalue: 1

Optional radius

radius: number | StyleValueFunction<number> | StyleZoomRange<number> | StyleExpression<number>

The Radius of the Sphere. The default unit is pixels. The radius of "Sphere" must be defined in pixels.

example

// define a Sphere with a radius of 32 pixel.
{
    zIndex: 0,
    type: "Sphere",
    fill: "red",
    radius: 32
}

Optional scaleByAltitude

scaleByAltitude: boolean | StyleValueFunction<boolean> | StyleZoomRange<boolean> | StyleExpression<boolean>

Scales the size of a style based on the feature's altitude. If it's enabled (true), features closer to the camera will be drawn larger than those farther away. When off (false), the size of the style is always the same size, regardless of its actual altitude, as if it were placed on the ground (altitude 0). This attribute applies to styles of type "Rect", "Image", "Text", "Circle", "Line", "Box", or "Sphere" whose size (width, radius, strokeWidth) that are using "map" alignment only. If the size attribute is defined in meters, scaleByAltitude is enabled by default, for pixels it is disabled.

defaultvalue: false (pixels), true (meters)
experimental

Optional shininess

shininess: number

Sets the shininess of the "Sphere", determining how glossy its surface appears. A higher value makes the "Sphere" surface more reflective.

Relationship with Specular

Effect: The shininess value controls the size and intensity of the specular highlight, which is colored by the specular property.
Specular Dependency: The shininess property enhances the effect of the specular color. If specular is not set, shininess has no visible effect.

Shininess Value Range and Effect

Range: The shininess value typically ranges from 0 to 128.
Low Values (0-10): Produce a wide, diffused highlight, resulting in a matte or dull appearance.
High Values (50-128): Produce a small, intense highlight, resulting in a glossy or shiny appearance.

defaultvalue: 32

Optional specular

specular: Color | StyleValueFunction<Color> | StyleZoomRange<Color> | StyleExpression<Color>

Sets the specular color of the "Sphere", affecting how it reflects light.

Relationship with Shininess

Effect: The specular property determines the color of the light reflection, while the shininess value controls the intensity and size of the reflection.
Shininess Dependency: If specular is set and shininess is not explicitly set, the default shininess value will be used to control the reflection's appearance.

see: Color for a detailed list of possible supported formats.

type

type: "Sphere"

Specifies the type of style to render.

zIndex

zIndex: number | StyleValueFunction<number> | StyleZoomRange<number> | StyleExpression<number>

Indicates the drawing order within a layer. Styles with larger zIndex value are rendered above those with smaller values. The zIndex is defined relative to the "zLayer" property. If "zLayer" is defined all zIndex values are relative to the "zLayer" value.

Optional zLayer

zLayer: number | StyleValueFunction<number> | StyleExpression<number>

Indicates drawing order across multiple layers. Styles using zLayer with a high value are rendered on top of zLayers with a low value. If no zLayer is defined, it will fall back to the LayerStyle.zLayer or depend on the display layer order. The first (lowest) layer has a zLayer value of 1.

example: {...zLayer: 2, zIndex: 5} will be rendered on top of {...zLayer: 1, zIndex: 10}