diff --git a/projects/observability/src/shared/components/gauge/gauge.component.test.ts b/projects/observability/src/shared/components/gauge/gauge.component.test.ts index 71669c088..7dddfbb61 100644 --- a/projects/observability/src/shared/components/gauge/gauge.component.test.ts +++ b/projects/observability/src/shared/components/gauge/gauge.component.test.ts @@ -56,7 +56,7 @@ describe('Gauge component', () => { value: 80, maxValue: 100, valueArc: - 'M-137.45365478341216,36.83059579592157A7.5,7.5,0,0,1,-146.73136591755903,31.143317998687955A150,150,0,0,1,88.13185990085536,-121.37864421065183A7.5,7.5,0,0,1,89.55386161673987,-110.58980906724544L89.55386161673987,-110.58980906724544A7.5,7.5,0,0,1,79.31867391076982,-109.24077978958663A135,135,0,0,0,-132.05822932580313,28.02898619881914A7.5,7.5,0,0,1,-137.45365478341216,36.83059579592157Z', + 'M-137.45365478341216,36.83059579592157A7.5,7.5,0,0,1,-146.73136591755903,31.143317998687955A150,150,0,0,1,129.88160257335298,-75.03845222935763A7.5,7.5,0,0,1,126.79245119273195,-64.60398068647702L126.79245119273195,-64.60398068647702A7.5,7.5,0,0,1,116.8934423160177,-67.5346070064219A135,135,0,0,0,-132.05822932580313,28.02898619881914A7.5,7.5,0,0,1,-137.45365478341216,36.83059579592157Z', threshold: { color: '#9e4c41', end: 90, diff --git a/projects/observability/src/shared/components/gauge/gauge.component.ts b/projects/observability/src/shared/components/gauge/gauge.component.ts index b423c5327..0391fc715 100644 --- a/projects/observability/src/shared/components/gauge/gauge.component.ts +++ b/projects/observability/src/shared/components/gauge/gauge.component.ts @@ -104,11 +104,13 @@ export class GaugeComponent implements OnChanges { } private buildValueArc(radius: number, inputData: GaugeInputData): string { + const startAngle = -(Math.PI / 2 + GaugeComponent.EXTRA_ARC_ANGLE); + return this.buildArcGenerator()({ innerRadius: radius - GaugeComponent.GAUGE_RING_WIDTH, outerRadius: radius, - startAngle: -Math.PI / 2 - GaugeComponent.EXTRA_ARC_ANGLE, - endAngle: -Math.PI / 2 - GaugeComponent.EXTRA_ARC_ANGLE + (inputData.value / inputData.maxValue) * Math.PI + startAngle: startAngle, + endAngle: startAngle + 2 * (inputData.value / inputData.maxValue) * -startAngle })!; }