ZoomCharts Documentation


Inheritance hierarchy

This type inherits from LinearChartSettingsSeriesStyle.

This type is implemented by FacetChartSettingsFacetStyle and FacetChartSettingsSeriesColumnsStyle.


This type does not define any methods.


clusterPadding: [number, number]

Padding for cluster. 0th element - left padding, 1st element - right padding.

connectorLineID: string

Which logical grouping to use for drawing connector lines

connectorLinePositionX: "edge" | "center" | "full"

Where to start drawing the connecting line

Valid values:
  • edge - From nearest edge
  • center - From column center
  • full - From opposing edge
depth: number

Depth for column. Use it to achieve 3D effect.

depthBrightness: number

Brightness applied to depth components.

enableOutlineLines: boolean

Whether to draw an outline around the columns

fillColor: string

Fill color.

fillGradient: GradientDefinition

Fill gradient. Allows building a gradient fill, bound to values. Contains array of value-color pairs. For example: [[-20, 'rgba(0,0,255,0.4)'],[30,'rgba(255,0,0,0.7)']]. If specified fillGradientMode: "horizontal" or "vertical", then value denotes fraction of the column width and must be in interval from 0 to 1 - this feature is available for columns only For example: [[0,"black"],[0.5,"red"],[1, "orange"]].

fillGradientMode: "vertical" | "horizontal"

Fill gradient orientation for manual fill gradient mode. In use with fillGradient property. "null" for default fillGradient mode, "vertical" for vertical gradient, "horizontal" for horizonal rendering"

fillGradientType: "cylinder"

Fill gradient type lets you have automated fillGradient steps based on different shapes. Supported types are: null | cylinder

fillPattern: string
Introduced in version 1.16.0.

Specifies the URL to the image that will be used as the repeated fill pattern for the series.

When fillPattern is specified, fillGradient is ignored. If fillColor is specified together with fillPattern, it will be used as the background color for the pattern.

gradient: number

A linear gradient for color change along a line between the column bottom and upper side. Specify "1" for no gradiend. Values 0..` will make the bottom part of columns slightly darker.

Introduced in version 1.13.1.

Style settings for the legend item that is rendered for the series.

Introduced in version 1.13.2.

Configures the marker that is shown in the legend. Note that the default (shape: null) means that instead of the plain marker, an icon representing the series visual style will be used.

textColor: string
Introduced in version 1.13.1.

The color used for the label of the legend item. Note that for disabled series advanced.disabledSeries.textColor takes precedence.

lineColor: string

Outline color.

lineDash: Array<number>

Array of line dash pattern to have a dashed line. The array contains length of dash followed by length of space in pixels. A sequence of multiple dash-space values is supported. In case you want to set a solid line, pass empty array: []

lineDashOffset: number

Start offset of line dash, in pixels

lineWidth: number

Width of the line.

minHeight: number

Minimum height of a column in px.

padding: [number, number]

Padding for column. 0th element - left padding, 1st element - right padding.

radius: [number, number, number, number]

Radius for top-left, top-right, bottom-right, bottom-left corner

shadowBlur: number

Shadow blur effect range.

shadowColor: string

Shadow color of column. If undefined, no shadow will be applied. Leave empty to use default shadow or set your own shadow color.

shadowOffsetX: number

Shadow direction, x component.

shadowOffsetY: number

Shadow direction, y component.

widthScale: number

What factor to scale the column widths by, between 0.0 and 1.0.

If set to 0, the columns will be drawn as lines instead of columns.