RadialGauge | LightningChart® JS API Documentation

Class of Radial Gauge represents the type of the gauge of a circular shape.

Properties

Readonly engine

engine : PublicEngine

Public, safe interface for Panels rendering engine.

pixelScale

pixelScale : Vec2<Scale>

Scale for panel area in pixels. Margin should be set according to panel margin (currently constant).

uiScale

uiScale : Vec2<Scale>

Scale for panel area in percentages (0-100). Margin should be set according to panel margin (currently constant).

Methods

addLegendBox

addLegendBox(builder: UIElementBuilder<UIElementType>, scale: Vec2<Scale>): UIElementType & UIElement

Add a stand-alone LegendBox using a builder.

Type parameters
- UIElementType: UIPart = UILegendBox
  
  Type of UIElement that is specified by 'builder'-parameter.
Parameters
- builder: UIElementBuilder<UIElementType>
  
  LegendBoxBuilder. If omitted, HorizontalLegendBox will be selected. Use LegendBoxBuilders for selection.
- scale: Vec2<Scale>
  
  Optional custom scale to position LegendBox on. Defaults to whole chart in percentages [0, 100].
Returns UIElementType & UIElement

LegendBox that fulfills interfaces: UIElementType (typeparam) and UIElement

addUIElement

addUIElement(builder: UIElementBuilder<UIElementType>, scale: Vec2<Scale>): UIElementType & UIElement

Add a stand-alone UIElement using a builder.

Type parameters
- UIElementType: UIPart = UITextBox
  
  Type of UIElement that is specified by 'builder'-parameter.
Parameters
- builder: UIElementBuilder<UIElementType>
  
  UIElementBuilder. If omitted, TextBoxBuilder will be selected. Use UIElementBuilders for selection.
- scale: Vec2<Scale>
  
  Optional custom scale to position UIElement on. Defaults to whole chart in percentages [0, 100].
Returns UIElementType & UIElement

Object that fulfills interfaces: UIElementType (typeparam) and UIElement

disableAnimations

disableAnimations(): this

Disable all animations for the chart.

All animations have to be re-enabled individually if you wish to re-enable animations.

Returns this

Chart itself for fluent interface.

dispose

dispose(): this

Permanently dispose the component.

To fully allow Garbage-Collection to free the resources used by the component, make sure to remove any references to the component and its children in application code.
```
let chart = ...Gauge()
let slice = chart.getDefaultSlice()
// Dispose Chart, and remove all references so that they can be garbage-collected.
chart.dispose()
chart = undefined
slice = undefined
```
Returns this

Object itself for fluent interface

getAngleInterval

getAngleInterval(): AngleInterval

Get the angular interval of the gauge.

Returns AngleInterval

Angle interval object {min, max} in degrees.

getAnimationsEnabled

getAnimationsEnabled(): boolean

Gets if animations are enabled or not.

Returns boolean

Boolean state for animations enabled

getBackgroundFillStyle

getBackgroundFillStyle(): FillStyle

Get fillstyle of chart background.

Returns FillStyle

FillStyle

getBackgroundStrokeStyle

getBackgroundStrokeStyle(): LineStyle

Get stroke style of chart background.

Returns LineStyle

LineStyle

getPadding

getPadding(): Margin

Get padding around Chart in pixels.

Returns Margin

Padding datastructure

getTitle

getTitle(): string

Get text of Chart title.

Returns string

Chart title as a string.

getTitleFillStyle

getTitleFillStyle(): FillStyle

Get fill style of Chart Title.

Returns FillStyle

FillStyle object

getTitleFont

getTitleFont(): FontSettings

Get font of Chart title.

Returns FontSettings

FontSettings object

getTitleMarginBottom

getTitleMarginBottom(): number

Returns number

Padding after Chart title

getTitleMarginTop

getTitleMarginTop(): number

Returns number

Padding before Chart title

offAngleIntervalChange

offAngleIntervalChange(token: Token): boolean

Remove listener with provided token.

Parameters
- token: Token
  
  Token of the listener.
Returns boolean

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

offResize

offResize(token: Token): boolean

Remove event listener from resize 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

onAngleIntervalChange

onAngleIntervalChange(clbk: GaugeAngleIntervalEventHandler<this>): Token

Subscribe to Gauge Angle Change event.

Parameters
- clbk: GaugeAngleIntervalEventHandler<this>
Returns Token

Token of the listener.

onResize

onResize(handler: function): Token

Subscribe to resize event of Panel.

Parameters
- handler: function
  
  Handler function for event
  - - Parameters
      - obj: this
      - width: pixel
      - height: pixel
      - engineWidth: pixel
      - engineHeight: pixel
      Returns void
Returns Token

Token of subscription

saveToFile

saveToFile(fileName: string, type?: undefined | string, encoderOptions?: undefined | number): this

Capture rendered state in an image file. Prompts the browser to download the created file.

NOTE: The download might be blocked by browser/plugins as harmful. To prevent this, only call the method in events tied to user-interactions. From mouse-event handlers, for example.

Has two optional parameters which directly reference JavaScript API HTMLCanvasElement.toDataURL. For supported image formats, compression quality, Etc. refer to:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL

Example usage:
```
// Download 'screenshot.png'
Panel.saveToFile('screenshot')
// Attempt download 'maybeNotSupported.bmp'
Panel.saveToFile('maybeNotSupported', 'image/bmp')
// Attempt download jpeg.file with specified compression quality
Panel.saveToFile('fileName', 'image/jpeg', 0.50)
```
sideeffect

If 'type' is not supported by browser, an Error will be thrown.
Parameters
- fileName: string
  
  Name of prompted download file as string. File extension shouldn't be included as it is automatically detected from 'type'-argument.
- type: undefined | string
  
  A DOMString indicating the image format. The default format type is image/png.
- encoderOptions: undefined | number
  
  A Number between 0 and 1 indicating the image quality to use for image formats that use lossy compression such as image/jpeg and image/webp. If this argument is anything else, the default value for image quality is used. The default value is 0.92.
Returns this

setAngleInterval

setAngleInterval(start: number, end: number): this

Set angular interval of the gauge in degrees.

Parameters
- start: number
  
  Start angle of the gauge in degrees.
- end: number
  
  End angle of the gauge in degrees.
Returns this

Gauge itself for fluent interface.

setAnimationsEnabled

setAnimationsEnabled(animationsEnabled: boolean): this

Sets if animations are enabled or not.

Parameters
- animationsEnabled: boolean
  
  Boolean state for animations enabled
Returns this

Gauge itself for fluent interface.

setBackgroundFillStyle

setBackgroundFillStyle(value: FillStyle | ImmutableMutator<FillStyle>): this

Set fillStyle of panel background.

Parameters
- value: FillStyle | ImmutableMutator<FillStyle>
  
  FillStyle or function which modifies it
Returns this

Object itself

setBackgroundStrokeStyle

setBackgroundStrokeStyle(value: LineStyle | ImmutableMutator<LineStyle>): this

Set stroke style of panel background.

Parameters
- value: LineStyle | ImmutableMutator<LineStyle>
  
  LineStyle or function which modifies it
Returns this

Object itself

setGaugeFillStyle

setGaugeFillStyle(value: FillStyle | ImmutableMutator<FillStyle>): this

Apply new fill style to slice arc.

Parameters
- value: FillStyle | ImmutableMutator<FillStyle>
  
  FillStyle or mutator to modify the existing one.
Returns this

Gauge itself for fluent interface.

setGaugeStrokeStyle

setGaugeStrokeStyle(value: LineStyle | ImmutableMutator<LineStyle>): this

Set stroke of gauge background

Parameters
- value: LineStyle | ImmutableMutator<LineStyle>
  
  LineStyle or mutator to modify the existing one.
Returns this

Gauge itself for fluent interface.

setPadding

setPadding(padding: Partial<Margin> | number): this

Set padding around Chart in pixels.

Parameters
- padding: Partial<Margin> | number
  
  Number with pixel margins for all sides or datastructure with individual pixel paddings for each side. Any side can be omitted, only passed values will be overridden.
Returns this

Object itself

setTitle

setTitle(title: string): this

Set text of Chart title.

Parameters
- title: string
  
  Chart title as a string.
Returns this

Object itself for fluent interface.

setTitleFillStyle

setTitleFillStyle(value: FillStyle | ImmutableMutator<FillStyle>): this

Set fill style of Chart Title.

Example usage:
```
// Create a new style
Chart.setTitleFillStyle(new SolidFill({ color: ColorHEX('#F00') }))
// Change transparency
Chart.setTitleFillStyle((solidFill) => solidFill.setA(80))
// Set hidden
Chart.setTitleFillStyle(emptyFill)
```
Parameters
- value: FillStyle | ImmutableMutator<FillStyle>
  
  Either a FillStyle object or a function, which will be used to create a new FillStyle based on current value.
Returns this

Chart itself

setTitleFont

setTitleFont(value: FontSettings | ImmutableMutator<FontSettings>): this

Set font of Chart Title.

Example usage:
```
// Create a new FontSettings
Chart.setTitleFont(new FontSettings({ size: 24, style: 'italic' }))
// Change existing settings
Chart.setTitleFont((fontSettings) => fontSettings.setWeight('bold'))
```
Parameters
- value: FontSettings | ImmutableMutator<FontSettings>
  
  Either a FontSettings object or a function, which will be used to create a new FontSettings based on current value.
Returns this

Chart itself

setTitleMarginBottom

setTitleMarginBottom(marginPixels: pixel): this

Specifies padding after chart title.

This does not have an effect if title is hidden (empty FillStyle).

Parameters
- marginPixels: pixel
  
  Gap after the chart title in pixels.
Returns this

Chart itself for fluent interface

setTitleMarginTop

setTitleMarginTop(marginPixels: pixel): this

Specifies padding before chart title.

This does not have an effect if title is hidden (empty FillStyle).

Parameters
- marginPixels: pixel
  
  Gap between the top of chart and its title in pixels.
Returns this

Chart itself for fluent interface

Index

Properties

Methods

Properties

Readonly engine

pixelScale

uiScale

Methods

addLegendBox

Type parameters

UIElementType: UIPart = UILegendBox

Parameters

builder: UIElementBuilder<UIElementType>

scale: Vec2<Scale>

Returns UIElementType & UIElement

addUIElement

Type parameters

UIElementType: UIPart = UITextBox

Parameters

builder: UIElementBuilder<UIElementType>

scale: Vec2<Scale>

Returns UIElementType & UIElement

disableAnimations

Returns this

dispose

Returns this

getAngleInterval

Returns AngleInterval

getAnimationsEnabled

Returns boolean

getBackgroundFillStyle

Returns FillStyle

getBackgroundStrokeStyle

Returns LineStyle

getPadding

Returns Margin

getTitle

Returns string

getTitleFillStyle

Returns FillStyle

getTitleFont

Returns FontSettings

getTitleMarginBottom

Returns number

getTitleMarginTop

Returns number

offAngleIntervalChange

Parameters

token: Token

Returns boolean

offResize

Parameters

token: Token

Returns boolean

onAngleIntervalChange

Parameters

clbk: GaugeAngleIntervalEventHandler<this>

Returns Token

onResize

Parameters

handler: function

Parameters

obj: this

width: pixel

height: pixel

engineWidth: pixel

engineHeight: pixel

Returns void

Returns Token

saveToFile

Parameters

fileName: string

type: undefined | string

encoderOptions: undefined | number

Returns this

setAngleInterval

Parameters

start: number

end: number

Returns this