fix(gauge): units position if fullCircle

Adjust unit text position to prevent overlapping
with the value text.

Close #1914

AUTHORS.txt

@@ -42,3 +42,4 @@ ECrownofFire <ECrownofFire@gmail.com>
 Artem Savienkov <as@attractgroup.com>
 Hamid Sarfraz <praisedpk@gmail.com>
 Alan Hamlett <alan.hamlett@gmail.com>
+Nicolas Forêt <nicolas4@gmail.com>

src/ChartInternal/shape/arc.ts

@@ -846,11 +846,11 @@ export default {
 
 			isFullCircle && text && text.attr("dy", `${hasMultiArcGauge ? 0 : Math.round(state.radius / 14)}`);
 
-			arcs.select(`.${CLASS.chartArcsGaugeUnit}`)
-				.attr("dy", ".75em")
-				.text(config.gauge_label_show ? config.gauge_units : "");
-
 			if (config.gauge_label_show) {
+				arcs.select(`.${CLASS.chartArcsGaugeUnit}`)
+					.attr("dy", `${isFullCircle ? 1.5 : 0.75}em`)
+					.text(config.gauge_units);
+
 				arcs.select(`.${CLASS.chartArcsGaugeMin}`)
 					.attr("dx", `${-1 * (state.innerRadius + ((state.radius - state.innerRadius) / (isFullCircle ? 1 : 2)))}px`)
 					.attr("dy", "1.2em")

test/shape/gauge-spec.ts

@@ -763,8 +763,8 @@ describe("SHAPE GAUGE", () => {
         });
 	});
 
-	describe("Max text value", () => {
-        it("max ", () => {
+	describe("Text value & positioning", () => {
+        it("check max text value ", () => {
 			const args = {
                 data: {
 					columns: [
@@ -783,6 +783,27 @@ describe("SHAPE GAUGE", () => {
 			expect(args.gauge.max).to.be.below(maxValue);
 			expect(maxValue).to.be.equal(args.data.columns[0][1]);
 			expect(chart.config("gauge.max")).to.be.equal(maxValue);
-        });
+		});
+
+		it("unit text position shouldn't be overlapped with value", () => {
+			const args = {
+				data: {
+					columns: [
+						["data", 91.4]
+					],
+					type: "gauge"
+				},
+				gauge: {
+					fullCircle: true,
+					units: "units"
+				}
+            };
+			const chart = util.generate(args);
+
+			const valueRect = chart.$.text.texts.node().getBoundingClientRect();
+			const unitRect = chart.$.main.select(`.${CLASS.chartArcsGaugeUnit}`).node().getBoundingClientRect();
+
+			expect(unitRect.y).to.be.greaterThan(valueRect.y + valueRect.height);
+		});
     });
 });