Gauge Chart
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 |
showText | boolean | true | show or hide the inner text |
Property | Description |
select | click event |
activate | element activation event (mouse enter) |
deactivate | element deactivation event (mouse leave) |
The data format is single series:
[{"name": "Germany","value": 8940000},{"name": "USA","value": 5000000}]