Gauge Chart
Gauge
Inputs
Property | Type | Default Value | Description |
view | number[] | the dimensions of the chart [width, height]. If left undefined, the chart will fit to the parent container size | |
results | object[] | the chart data | |
scheme | object | the color scheme of the chart | |
customColors | function or object | custom colors for the chart. Used to override a color for a specific value | |
animations | boolean | true | enable animations |
legend | boolean | false | show or hide the legend |
legendTitle | string | 'Legend' | the legend title |
min | number | 0 | starting point of the scale |
max | number | 100 | ending point of the scale |
units | string | text to display under the value | |
bigSegments | number | 10 | number of big segments on the axis |
smallSegments | number | 5 | number of small segments between every big segment |
showAxis | boolean | true | show or hide the axis |
axisTickFormatting | function | the axis tick formatting | |
valueFormatting | function | function that formats the value in the middle of the chart | |
angleSpan | number | 240 | the angle that the chart spans (in degrees) |
startAngle | number | -120 | the angle that the chart is rotated by. Use negative half of the spanning angle to centralize |
tooltipDisabled | boolean | false | show or hide the tooltip |
tooltipTemplate | TemplateRef | a custom ng-template to be displayed inside the tooltip |
Outputs
Property | Description |
select | click event |
activate | element activation event (mouse enter) |
deactivate | element deactivation event (mouse leave) |
Data Format
The data format is single series:
Last updated