OpenLayers

Namespace: style

olx.style

Type Definitions

olx.style.AtlasManagerOptions{Object}

Properties:
Name Type Argument Description
initialSize number | undefined <optional>

The size in pixels of the first atlas image. If no value is given the ol.INITIAL_ATLAS_SIZE compile-time constant will be used.
maxSize number | undefined <optional>

The maximum size in pixels of atlas images. If no value is given then the ol.MAX_ATLAS_SIZE compile-time constant will be used. And if ol.MAX_ATLAS_SIZE is set to -1 (the default) then ol.WEBGL_MAX_TEXTURE_SIZE will used if WebGL is supported. Otherwise 2048 is used.
space number | undefined <optional>

The space in pixels between images (default: 1).

olx.style.CircleOptions{Object}

Properties:
Name Type Argument Description
fill ol.style.Fill | undefined <optional>

Fill style.
radius number

Circle radius. Required.
snapToPixel boolean | undefined <optional>

If true integral numbers of pixels are used as the X and Y pixel coordinate when drawing the circle in the output canvas. If false fractional numbers may be used. Using true allows for "sharp" rendering (no blur), while using false allows for "accurate" rendering. Note that accuracy is important if the circle's position is animated. Without it, the circle may jitter noticeably. Default value is true.
stroke ol.style.Stroke | undefined <optional>

Stroke style.
atlasManager ol.style.AtlasManager | undefined <optional>

The atlas manager to use for this circle. When using WebGL it is recommended to use an atlas manager to avoid texture switching. If an atlas manager is given, the circle is added to an atlas. By default no atlas manager is used.

olx.style.FillOptions{Object}

Properties:
Name Type Argument Description
color ol.Color | ol.ColorLike | undefined <optional>

A color, gradient or pattern. See ol.color and ol.colorlike for possible formats. Default null; if null, the Canvas/renderer default black will be used.

olx.style.IconOptions{Object}

Properties:
Name Type Argument Description
anchor Array.<number> | undefined <optional>

Anchor. Default value is [0.5, 0.5] (icon center).
anchorOrigin ol.style.IconOrigin | undefined <optional>

Origin of the anchor: bottom-left, bottom-right, top-left or top-right. Default is top-left.
anchorXUnits ol.style.IconAnchorUnits | undefined <optional>

Units in which the anchor x value is specified. A value of 'fraction' indicates the x value is a fraction of the icon. A value of 'pixels' indicates the x value in pixels. Default is 'fraction'.
anchorYUnits ol.style.IconAnchorUnits | undefined <optional>

Units in which the anchor y value is specified. A value of 'fraction' indicates the y value is a fraction of the icon. A value of 'pixels' indicates the y value in pixels. Default is 'fraction'.
color ol.Color | string | undefined <optional>

Color to tint the icon. If not specified, the icon will be left as is.
crossOrigin null | string | undefined <optional>

The crossOrigin attribute for loaded images. Note that you must provide a crossOrigin value if you are using the WebGL renderer or if you want to access pixel data with the Canvas renderer. See https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image for more detail.
img Image | HTMLCanvasElement | undefined <optional>

Image object for the icon. If the src option is not provided then the provided image must already be loaded. And in that case, it is required to provide the size of the image, with the imgSize option.
offset Array.<number> | undefined <optional>

Offset, which, together with the size and the offset origin, define the sub-rectangle to use from the original icon image. Default value is [0, 0].
offsetOrigin ol.style.IconOrigin | undefined <optional>

Origin of the offset: bottom-left, bottom-right, top-left or top-right. Default is top-left.
opacity number | undefined <optional>

Opacity of the icon. Default is 1.
scale number | undefined <optional>

Scale. Default is 1.
snapToPixel boolean | undefined <optional>

If true integral numbers of pixels are used as the X and Y pixel coordinate when drawing the icon in the output canvas. If false fractional numbers may be used. Using true allows for "sharp" rendering (no blur), while using false allows for "accurate" rendering. Note that accuracy is important if the icon's position is animated. Without it, the icon may jitter noticeably. Default value is true.
rotateWithView boolean | undefined <optional>

Whether to rotate the icon with the view. Default is false.
rotation number | undefined <optional>

Rotation in radians (positive rotation clockwise). Default is 0.
size ol.Size | undefined <optional>

Icon size in pixel. Can be used together with offset to define the sub-rectangle to use from the origin (sprite) icon image.
imgSize ol.Size | undefined <optional>

Image size in pixels. Only required if img is set and src is not, and for SVG images in Internet Explorer 11. The provided imgSize needs to match the actual size of the image.
src string | undefined <optional>

Image source URI.

olx.style.RegularShapeOptions{Object}

Specify radius for regular polygons, or radius1 and radius2 for stars.

Properties:
Name Type Argument Description
fill ol.style.Fill | undefined <optional>

Fill style.
points number

Number of points for stars and regular polygons. In case of a polygon, the number of points is the number of sides. Required.
radius number | undefined <optional>

Radius of a regular polygon.
radius1 number | undefined <optional>

Outer radius of a star.
radius2 number | undefined <optional>

Inner radius of a star.
angle number | undefined <optional>

Shape's angle in radians. A value of 0 will have one of the shape's point facing up. Default value is 0.
snapToPixel boolean | undefined <optional>

If true integral numbers of pixels are used as the X and Y pixel coordinate when drawing the shape in the output canvas. If false fractional numbers may be used. Using true allows for "sharp" rendering (no blur), while using false allows for "accurate" rendering. Note that accuracy is important if the shape's position is animated. Without it, the shape may jitter noticeably. Default value is true.
stroke ol.style.Stroke | undefined <optional>

Stroke style.
rotation number | undefined <optional>

Rotation in radians (positive rotation clockwise). Default is 0.
rotateWithView boolean | undefined <optional>

Whether to rotate the shape with the view. Default is false.
atlasManager ol.style.AtlasManager | undefined <optional>

The atlas manager to use for this symbol. When using WebGL it is recommended to use an atlas manager to avoid texture switching. If an atlas manager is given, the symbol is added to an atlas. By default no atlas manager is used.

olx.style.StrokeOptions{Object}

Properties:
Name Type Argument Description
color ol.Color | ol.ColorLike | undefined <optional>

A color, gradient or pattern. See ol.color and ol.colorlike for possible formats. Default null; if null, the Canvas/renderer default black will be used.
lineCap string | undefined <optional>

Line cap style: butt, round, or square. Default is round.
lineJoin string | undefined <optional>

Line join style: bevel, round, or miter. Default is round.
lineDash Array.<number> | undefined <optional>

Line dash pattern. Default is undefined (no dash). Please note that Internet Explorer 10 and lower do not support the setLineDash method on the CanvasRenderingContext2D and therefore this option will have no visual effect in these browsers.
lineDashOffset number | undefined <optional>

Line dash offset. Default is '0'.
miterLimit number | undefined <optional>

Miter limit. Default is 10.
width number | undefined <optional>

Width.

olx.style.StyleOptions{Object}

Properties:
Name Type Argument Description
geometry undefined | string | ol.geom.Geometry | ol.StyleGeometryFunction <optional>

Feature property or geometry or function returning a geometry to render for this style.
fill ol.style.Fill | undefined <optional>

Fill style.
image ol.style.Image | undefined <optional>

Image style.
stroke ol.style.Stroke | undefined <optional>

Stroke style.
text ol.style.Text | undefined <optional>

Text style.
zIndex number | undefined <optional>

Z index.

olx.style.TextOptions{Object}

Properties:
Name Type Argument Description
font string | undefined <optional>

Font style as CSS 'font' value, see: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/font. Default is '10px sans-serif'
offsetX number | undefined <optional>

Horizontal text offset in pixels. A positive will shift the text right. Default is 0.
offsetY number | undefined <optional>

Vertical text offset in pixels. A positive will shift the text down. Default is 0.
scale number | undefined <optional>

Scale.
rotateWithView boolean | undefined <optional>

Whether to rotate the text with the view. Default is false.
rotation number | undefined <optional>

Rotation in radians (positive rotation clockwise). Default is 0.
text string | undefined <optional>

Text content.
textAlign string | undefined <optional>

Text alignment. Possible values: 'left', 'right', 'center', 'end' or 'start'. Default is 'start'.
textBaseline string | undefined <optional>

Text base line. Possible values: 'bottom', 'top', 'middle', 'alphabetic', 'hanging', 'ideographic'. Default is 'alphabetic'.
fill ol.style.Fill | undefined <optional>

Fill style. If none is provided, we'll use a dark fill-style (#333).
stroke ol.style.Stroke | undefined <optional>

Stroke style.