Angular Gauge Chart
Last updated
Last updated
The Angular Gauge chart is designed to display specific data using a semicircular shape with the pointer. The semicircular shape is created by defining the lower limit and upper limit, using functions like sum, min, max, count. Within that scale, we can create various color ranges in thresholds to classify the data.
We can make the pointer to indicate the sum/ avg/ min/ max/ count/ first/ last values of the metric over the semicircular shape. Thresholds can also be created on the pointer.
Metrics: 1 or more metrics
Attributes: 1 attribute.
Add as Filter Option - Not Available
You can add a title in Angular gauge chart and can do text formattings to the title. User can do labels formattings too in the Axes property tab.
In Vitara Charts, the new features added to the Gauge chart where there are some implementations in the Gauge property editor. Now, we have Dial, Gauge and Grid Line properties in the Gauge property.
Users can see the pointer at any aggregation level of metrics with start and end values. We can apply Start and End angles for the gauge chart.
Below is the example of the Cost metric shown with Avg aggregation with start value as ‘First’ aggregation and end value as ‘Last’ aggregation. The ‘Start’ angle is 30 degrees and the ‘End’ angle is 200 degrees.
We can now see the pointer (Current Value) at any aggregation level of metrics with the start and end values.
In Vitara charts, the dial properties are introduced. Dial’s color, dial’s width, dial’s border color, dial’s border width, Start and End position of needle, Grid line width and Grid line color are the new features introduced in the angular gauge chart.
Below screenshot is the example where all the dial and grid line properties are applied. Average aggregation is applied for current value and the dial and dial’s border properties are applied. Dial’s color - blue Dial’s width - 12 Border color - green Border width - 2 Start position - 65 End position - 105 Grid line width - 2 Grid line color - black
The steps to set a background image for all Vitara charts are explained in backgroundImage.
