Options
All
• Public
• Public/Protected
• All

# Class PolarPolygonSeries

Type of PolarSeries for visualizing a collection of polygons inside the Polar coordinate system. They are especially useful for highlighting parts of the Polar coordinate system.

PolarPolygonSeries are created with PolarChart.addPolygonSeries.

Create a PolarPolygon with PolarPolygonSeries.addPolygon.

Example usage:

`````` const polygonSeries = polarChart.addPolygonSeries()
let ang = 45
let amplitude = 50
const polygon = polygonSeries.addPolygon()
.setGeometry([
{ angle: (ang += 10), amplitude: (amplitude += 10) },
{ angle: (ang += 10), amplitude: (amplitude += 5) },
{ angle: (ang += 10), amplitude: (amplitude += 10) },
{ angle: (ang += 10), amplitude: (amplitude -= 5) },
{ angle: (ang += 10), amplitude: (amplitude += 5) },
{ angle: (ang += 5), amplitude: (amplitude -= 5) },
{ angle: (ang += 0), amplitude: (amplitude -= 10) },
{ angle: (ang -= 5), amplitude: (amplitude -= 5) },
{ angle: (ang -= 10), amplitude: (amplitude -= 10) },
{ angle: (ang -= 10), amplitude: (amplitude -= 5) },
{ angle: (ang -= 10), amplitude: (amplitude += 5) },
{ angle: (ang -= 10), amplitude: (amplitude += 10) },
])
``````

## Properties

Scale of the series

## Methods

• Create new polygon to the Series.

The style of polygons is shared, and can be modified with the Series API: PolarPolygonSeries.setFillStyle and PolarPolygonSeries.setStrokeStyle.

Specify the polygon geometry with PolarPolygon.setGeometry

Example usage:

`````` const polygonSeries = polarChart.addPolygonSeries()
let ang = 45
let amplitude = 50
const polygon = polygonSeries.addPolygon()
.setGeometry([
{ angle: (ang += 10), amplitude: (amplitude += 10) },
{ angle: (ang += 10), amplitude: (amplitude += 5) },
{ angle: (ang += 10), amplitude: (amplitude += 10) },
{ angle: (ang += 10), amplitude: (amplitude -= 5) },
{ angle: (ang += 10), amplitude: (amplitude += 5) },
{ angle: (ang += 5), amplitude: (amplitude -= 5) },
{ angle: (ang += 0), amplitude: (amplitude -= 10) },
{ angle: (ang -= 5), amplitude: (amplitude -= 5) },
{ angle: (ang -= 10), amplitude: (amplitude -= 10) },
{ angle: (ang -= 10), amplitude: (amplitude -= 5) },
{ angle: (ang -= 10), amplitude: (amplitude += 5) },
{ angle: (ang -= 10), amplitude: (amplitude += 10) },
])
``````

PolarPolygon

### attach

• Attach object to an legendBox entry

#### Parameters

• ##### entry: LegendBoxEntry

Object which has to be attached

• ##### disposeOnClick: boolean

Flag that indicates whether the Attachable should be disposed/restored, when its respective Entry is clicked.

#### Returns this

Series itself for fluent interface

### dispose

• dispose(): this
• Tell the owning chart to remove this component.

#### Returns this

Object itself.

### getAmplitudeMax

• getAmplitudeMax(): number | undefined
• Get max amplitude value of PolarSeries' data points.

#### Returns number | undefined

number or undefined if no data is set.

### getAmplitudeMin

• getAmplitudeMin(): number | undefined
• Get min amplitude value of PolarSeries' data points.

#### Returns number | undefined

number or undefined if no data is set.

### getCursorEnabled

• getCursorEnabled(): boolean
• #### Returns boolean

Whether Cursor is enabled or not

### getCursorResultTableFormatter

• Get ResultTable Formatter.

#### Returns PolarSeriesFormatter

Function which builds ResultTable content for SpiderSeries.

### getFillStyle

• Get fill style of Series.

#### Returns FillStyle

FillStyle object

### getFillStyleHighlight

• Get fill style of Series when it is highlighted. Highlighting is activated by placing mouse on top / touching Series (if mouse-interactions are not disabled), or by using setHighlighted() method.

#### Returns FillStyle

FillStyle object

### getHighlightOnHover

• getHighlightOnHover(): boolean
• Get boolean flag for whether object should highlight on mouse hover

#### Returns boolean

Boolean for if object should highlight on mouse hover or not.

### getHighlighted

• getHighlighted(): boolean
• #### Returns boolean

the state of highlighted flag

### getIsUnderMouse

• getIsUnderMouse(): boolean
• Get boolean flag for whether object is currently under mouse or not

#### Returns boolean

Boolean for is object under mouse currently

### getMouseInteractions

• getMouseInteractions(): boolean
• Get mouse interactions enabled or disabled. Disabled mouse-interactions will naturally prevent mouse-driven highlighting from ever happening.

#### Returns boolean

Mouse interactions state

### getName

• getName(): string
• Get the name of the Component.

#### Returns string

The name of the Component.

### getStrokeStyle

• Get stroke style of Series.

#### Returns LineStyle

LineStyle object

### getStrokeStyleHighlight

• Get stroke style of Series when it is highlighted. Highlighting is activated by placing mouse on top / touching Series (if mouse-interactions are not disabled), or by using setHighlighted() method.

#### Returns LineStyle

LineStyle object

### isDisposed

• isDisposed(): boolean
• #### Returns boolean

TODO: True for enabled and false for disabled

### offHighlight

• offHighlight(token: Token): boolean
• Unsubscribe from Highlight object event. This is called whenever an object is highlighted

#### Parameters

• ##### token: Token

Token that was received when subscribing to the event.

#### Returns boolean

True if the unsubscription was successful.

### offHover

• offHover(token: Token): boolean
• Remove event listener from Series Hover Event.

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseClick

• offMouseClick(token: Token): boolean
• Remove event listener from Mouse Click Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseDoubleClick

• offMouseDoubleClick(token: Token): boolean
• Remove event listener from Mouse Double Click Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseDown

• offMouseDown(token: Token): boolean
• Remove event listener from Mouse Down Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseDrag

• offMouseDrag(token: Token): boolean
• Remove event listener from Mouse Drag Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseDragStart

• offMouseDragStart(token: Token): boolean
• Remove event listener from Mouse Drag Start Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseDragStop

• offMouseDragStop(token: Token): boolean
• Remove event listener from Mouse Drag Stop Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseEnter

• offMouseEnter(token: Token): boolean
• Remove event listener from Mouse Enter Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseLeave

• offMouseLeave(token: Token): boolean
• Remove event listener from Mouse Leave Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseMove

• offMouseMove(token: Token): boolean
• Remove event listener from Mouse Move Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseUp

• offMouseUp(token: Token): boolean
• Remove event listener from Mouse Up Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offMouseWheel

• offMouseWheel(token: Token): boolean
• Remove event listener from Mouse Wheel Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offTouchEnd

• offTouchEnd(token: Token): boolean
• Remove event listener from Touch End Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offTouchMove

• offTouchMove(token: Token): boolean
• Remove event listener from Touch Move Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### offTouchStart

• offTouchStart(token: Token): boolean
• Remove event listener from Touch Start Event

#### Parameters

• ##### token: Token

Token of event listener which has to be removed

#### Returns boolean

True if the listener is successfully removed and false if it is not found

### onHighlight

• onHighlight(handler: function): Token
• Subscribe to highlight object event. This is called whenever an object is highlighted.

#### Parameters

• ##### handler: function

Function that is called when event is triggered.

#### Returns Token

Token that can be used to unsubscribe from the event.

### onHover

• onHover(clbk: function): Token
• Add event listener to Series Hover Event. Hover event is a custom mouse-event designed for Series that is the main link between Cursors and Series.

#### Parameters

• ##### clbk: function

Callback function that is called whenever mouse enters / moves or leaves the Series

#### Returns Token

Token of the event listener

### onMouseClick

• Add event listener to Mouse Click Event

#### Parameters

• ##### clbk: MouseEventHandler<this>

Event listener for Mouse Click Event

#### Returns Token

Token of the event listener

### onMouseDoubleClick

• Add event listener to Mouse Double Click Event

#### Parameters

• ##### clbk: MouseEventHandler<this>

Event listener for Mouse Double Click Event

#### Returns Token

Token of the event listener

### onMouseDown

• Add event listener to Mouse Down Event

#### Parameters

• ##### clbk: MouseEventHandler<this>

Event listener for Mouse Down Event

#### Returns Token

Token of the event listener

### onMouseDrag

• Subscribe to Mouse Drag event

### onMouseDragStart

• Subscribe to Mouse Drag Start event

### onMouseDragStop

• Subscribe to Mouse Drag Stop event

### onMouseEnter

• Add event listener to Enter Event

#### Parameters

• ##### clbk: MouseEventHandler<this>

Event listener for Mouse Enter Event

#### Returns Token

Token of the event listener

### onMouseLeave

• Add event listener to Mouse Leave Event

#### Parameters

• ##### clbk: AbruptMouseEventHandler<this>

Event listener for Mouse Leave Event

#### Returns Token

Token of the event listener

### onMouseMove

• Add event listener to Mouse Move Event

#### Parameters

• ##### clbk: MouseEventHandler<this>

Event listener for Mouse Move Event

#### Returns Token

Token of the event listener

### onMouseUp

• Add event listener to Mouse Up Event

#### Parameters

• ##### clbk: MouseEventHandler<this>

Event listener for Mouse Up Event

#### Returns Token

Token of the event listener

### onMouseWheel

• Subscribe to Mouse Wheel event

#### Parameters

• ##### clbk: MouseWheelEventHandler<this>

Event handler function

#### Returns Token

Token of subscription

### onTouchEnd

• Subscribe to Touch End event

#### Parameters

• ##### clbk: TouchEventHandler<this>

Event handler function

#### Returns Token

Token of subscription

### onTouchMove

• Subscribe to Touch Move event

#### Parameters

• ##### clbk: TouchEventHandler<this>

Event handler function

#### Returns Token

Token of subscription

### onTouchStart

• Subscribe to Touch Start event

#### Parameters

• ##### clbk: TouchEventHandler<this>

Event handler function

#### Returns Token

Token of subscription

### restore

• restore(): this
• Tell the owning chart to restore this component.

#### Returns this

Object itself.

### setCursorEnabled

• setCursorEnabled(state: boolean): this
• Configure whether cursors should pick on this particular series or not.

`````` // Example, prevent chart auto cursor from snapping to a series.
LineSeries.setCursorEnabled(false)
``````

Related API:

• setCursorResultTableFormatter | configure formatting of result table contents, when this series is pointed.
• setCursorSolveBasis | configure basis of finding nearest data point for the series (`'nearest-x'`, `'nearest'`, etc.). This method is not available for all series types (more support will be added in near future).
• setCursorInterpolationEnabled | configure whether cursor should interpolate the displayed data point between the two closest data points, or snap to the nearest real data point. This method is not available for all series types.
• ChartXY.setAutoCursorMode | configure behavior when auto cursor is visible.

### setCursorResultTableFormatter

• Configure formatting of Cursor ResultTable when pointing at this series.

`````` // Example usage
PolarLineSeries.setCursorResultTableFormatter((tableBuilder, series, angleDeg, amplitude) => {
return tableBuilder
.addRow(`Pointing at`, '', series.getName())
.addRow(`Angle:`, '', angleDeg.toFixed(0) + ' deg')
})
``````

The general syntax of configuring ResultTable formatting is shared between all series types; You specify a callback function, which receives a TableContentBuilder. The contents of the table are then set using methods of the table builder:

`````` // Using TableContentBuilder.
PolarLineSeries.setCursorResultTableFormatter((tableBuilder, series, angleDeg, amplitude) => {
// addRow adds a list of strings to a new row in the table. Empty strings ('') will allocate any extra horizontal space within the row.
tableBuilder
.addRow('Item 0:', '', 'Value 0')
.addRow('Item 1:', '', 'Value 1')
.addRow('Long row that highlights the idea of empty strings')

// After configuration, the table builder must be returned!
return tableBuilder
})
``````

The additional values that are supplied to the callback function vary between different chart types, refer to the series documentation of `setCursorResultTableFormatter` to learn the exact available information. All `Polar Series` receive three extra parameters:

1. `series` | reference to the series itself.
2. `angleDeg` | pointed data point angle as degrees.
3. `amplitude` | pointed data point amplitude.

Related API:

#### Parameters

• ##### formatter: PolarSeriesFormatter

Function which builds ResultTable content.

#### Returns this

Object itself

### setFillStyle

• Set fill style of Series.

Example usage:

``````// Create a new style
PolarPolygonSeries.setFillStyle(new SolidFill({ color: ColorHEX('#F00') }))
// Change transparency
PolarPolygonSeries.setFillStyle((solidFill) => solidFill.setA(80))
// Set hidden
PolarPolygonSeries.setFillStyle(emptyFill)
``````

#### Parameters

• ##### value: FillStyle | ImmutableMutator<FillStyle>

Either a FillStyle object or a function, which will be used to create a new SolidLine based on current value.

Chart itself

### setFillStyleHighlight

• Set fill style of Series when it is highlighted. Highlighting is activated by placing mouse on top / touching Series (if mouse-interactions are not disabled), or by using setHighlighted() method.

Example usage:

``````// Create a new style
PolarPolygonSeries.setFillStyleHighlight(new SolidFill({ color: ColorHEX('#F00') }))
// Change transparency
PolarPolygonSeries.setFillStyleHighlight((solidFill) => solidFill.setA(80))
// Set hidden
PolarPolygonSeries.setFillStyleHighlight(emptyFill)
// Automatic
PolarPolygonSeries.setFillStyleHighlight(undefined)
``````
``````@param   value   Either a FillStyle object or a function, which will be used to modify current value or
undefined for automatic value based on normal style.
@returns         Chart itself
``````

### setHighlightOnHover

• setHighlightOnHover(state: boolean): this
• Set highlight on mouse hover enabled or disabled.

Mouse interactions have to be enabled on the component for this to function as expected. See setMouseInteractions for more information.

#### Parameters

• ##### state: boolean

True if highlighting on mouse hover, false if no highlight on mouse hover

#### Returns this

Object itself for fluent interface.

### setHighlighted

• setHighlighted(highLight: boolean): this
• Enable or disable forced highlighting of component

#### Parameters

• ##### highLight: boolean

True for enabled and false for disabled

#### Returns this

component itself for fluent interface

### setMouseInteractions

• setMouseInteractions(state: boolean): this
• Set component mouse interactions enabled or disabled.

Disabling mouse interactions means that the objects below this component can be interacted through it.

Possible side-effects from disabling mouse interactions:

• Mouse events are not triggered. For example, onMouseMove.
• Mouse driven highlighting will not work.

#### Parameters

• ##### state: boolean

Specifies state of mouse interactions

#### Returns this

Object itself for fluent interface

### setName

• setName(name: string): this
• Sets the name of the Component updating attached LegendBox entries

#### Parameters

• ##### name: string

Name of the Component

#### Returns this

Object itself

### setStrokeStyle

• Set stroke style of Series.

Example usage:

``````// Specified LineStyle
PolarPolygonSeries.setStrokeStyle(new SolidLine({ thickness: 2, fillStyle: new SolidFill({ color: ColorHEX('#F00') }) }))
// Changed thickness
PolarPolygonSeries.setStrokeStyle((solidLine) => solidLine.setThickness(5))
// Hidden
PolarPolygonSeries.setStrokeStyle(emptyLine)
``````

#### Parameters

• ##### value: LineStyle | ImmutableMutator<LineStyle>

Either a LineStyle object or a function, which will be used to create a new SolidLine based on current value.

Chart itself

### setStrokeStyleHighlight

• Set stroke style of Series when it is highlighted. Highlighting is activated by placing mouse on top / touching Series (if mouse-interactions are not disabled), or by using setHighlighted() method.

Example usage:

``````// Specified LineStyle
PolarPolygonSeries.setStrokeStyleHighlight(new SolidLine({ thickness: 2, fillStyle: new SolidFill({ color: ColorHEX('#F00') }) }))
// Changed thickness
PolarPolygonSeries.setStrokeStyleHighlight((solidLine) => solidLine.setThickness(5))
// Hidden.
PolarPolygonSeries.setStrokeStyleHighlight(emptyLine)
// Automatic
PolarPolygonSeries.setStrokeStyleHighlight(undefined)
``````

#### Parameters

• ##### value: LineStyle | ImmutableMutator<LineStyle> | undefined

Either a LineStyle object or a function, which will be used to modify current value or undefined for automatic value based on normal style.

Chart itself

### solveNearestFromScreen

• Abstract method that solves the nearest datapoint to a given coordinate on screen.

#### Parameters

• ##### location: Point

Location on screen

#### Returns PolarPolygonSeriesCursorPoint | undefined

Undefined or data-structure for positioning of cursors

### solveNearestFromSegment

• Abstract method that solves the nearest datapoint to a given coordinate on a screen from a specific segment.

#### Parameters

• ##### location: Point

Location on screen

• ##### segment: SimplePolygon

Segment to solve from

#### Returns PolarPolygonSeriesCursorPoint | undefined

Undefined or data-structure for positioning of cursors