Represents the Vue Circular Gauge component. This tag is used to customize the properties of the circular gauge to visualize the data in circular scale.
<ejs-circulargauge></ejs-circulargauge>
boolean
Enables and disables the export to image functionality in circular gauge.
Defaults to false
boolean
Enables or disables the ability of the gauge to be rendered to the complete width. The left, right, top and bottom spacing will not be considered in the gauge when this property is disabled.
Defaults to true
boolean
Enables and disables the export to pdf functionality in circular gauge.
Defaults to false
boolean
Enables and disables the print functionality in circular gauge.
Defaults to false
Sets and gets the options for customizing the axes of circular gauge.
string
Sets and gets the background color of the gauge. This property accepts value in hex code, rgba string as a valid CSS color string.
Defaults to null
Sets and gets the options for customizing the style properties of the gauge border.
string
Sets and gets the X coordinate of the center of the circular gauge.
Defaults to null
string
Sets and gets the Y coordinate of the center of the circular gauge.
Defaults to null
string
Sets and gets the information about gauge for assistive technology.
Defaults to null
boolean
Enable or disable persisting component’s state between page reloads.
Defaults to false
boolean
Enables and disables drag movement of the pointer in the circular gauge.
Defaults to false
boolean
Enables and disables the drag movement of the ranges in the circular gauge.
Defaults to false
boolean
Enable or disable rendering component in right to left direction.
Defaults to false
string
Sets and gets the height of the circular gauge as a string in order to provide input as both like ‘100px’ or ‘100%‘. If specified as ‘100%, gauge will render to the full height of its parent element.
Defaults to null
Sets and gets the options for customizing the legend of the circular gauge.
string
Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.
Defaults to ”
Sets and gets the options to customize the left, right, top and bottom margins of the circular gauge.
boolean
Enables and disables placing the half or quarter circle in center, if centerX
and centerY
properties are not specified.
Defaults to false
number
Sets and gets the tab index value for the circular gauge.
Defaults to 1
Sets and gets the theme styles supported for circular gauge. When the theme is set, the styles associated with the theme will be set in the gauge.
Defaults to Material
string
Sets and gets the title for circular gauge.
Defaults to ”
Sets and gets the options for customizing the title for circular gauge.
Sets and gets the options for customizing the tooltip of gauge.
boolean
Enables and disables the grouping separator should be used for a number.
Defaults to false
string
Sets and gets the width of the circular gauge as a string in order to provide input as both like ‘100px’ or ‘100%‘. If specified as ‘100%, gauge will render to the full width of its parent element.
Defaults to null
This method destroys the circular gauge. This method removes the events associated with the circular gauge and disposes the objects created for rendering and updating the circular gauge.
Returns void
This method is used to perform the export functionality for the circular gauge.
Parameter | Type | Description |
---|---|---|
type | ExportType |
Specifies the type of the export. |
fileName | string |
Specifies the file name for the exported file. |
orientation (optional) | PdfPageOrientation |
Specifies the orientation for the exported PDF document. |
allowDownload (optional) | boolean |
Specifies whether to download as a file. |
Returns Promise
This method is used to print the rendered circular gauge.
Parameter | Type | Description |
---|---|---|
id (optional) | string[] | string | Element |
Specifies the element to print the circular gauge. |
Returns void
This method is used to set the annotation content dynamically for circular gauge.
Parameter | Type | Description |
---|---|---|
axisIndex | number |
Specifies the index value for the axis in circular gauge. |
annotationIndex | number |
Specifies the index value for the annotation in circular gauge. |
content | string | Function |
Specifies the content for the annotation in circular gauge. |
Returns void
This method is used to set the pointer value dynamically for circular gauge.
Parameter | Type | Description |
---|---|---|
axisIndex | number |
Specifies the index value for the axis in circular gauge. |
pointerIndex | number |
Specifies the index value for the pointer in circular gauge. |
value | number |
Specifies the value for the pointer in circular gauge. |
Returns void
This method is used to set the range values dynamically for circular gauge.
Parameter | Type | Description |
---|---|---|
axisIndex | number |
Specifies the index value for the axis in circular gauge. |
rangeIndex | number |
Specifies the index value for the range in circular gauge. |
start | number |
Specifies the start value for the current range in circular gauge. |
end | number |
Specifies the end value for the current range in circular gauge. |
Returns void
EmitType<IAnimationCompleteEventArgs>
Triggers after the animation gets completed for pointers.
EmitType<IAnnotationRenderEventArgs>
Triggers before each annotation for the circular gauge gets rendered.
EmitType<IAxisLabelRenderEventArgs>
Triggers before each axis label gets rendered.
Triggers before the prints gets started.
EmitType<IPointerDragEventArgs>
Triggers after the pointer is dragged.
EmitType<IPointerDragEventArgs>
Triggers while dragging the pointers.
EmitType<IPointerDragEventArgs>
Triggers before the pointer is dragged.
Triggers on mouse down.
Triggers while cursor leaves the circular gauge.
Triggers on hovering the circular gauge.
Triggers when mouse up action is performed over the circular gauge.
EmitType<ILegendRenderEventArgs>
Triggers before each legend for the circular gauge gets rendered.
Triggers before the circular gauge gets loaded.
Triggers after the circular gauge gets loaded.
EmitType<IRadiusCalculateEventArgs>
Triggers before the radius for the circular gauge gets calculated.
Triggers to notify the resize of the circular gauge when the window is resized.
EmitType<ITooltipRenderEventArgs>
Triggers before the tooltip for pointer of the circular gauge gets rendered.