fix: sometimes volume label is displayed incorrectly

devexperts · Nov 1, 2023 · 7a99f40 · 7a99f40
1 parent a2d3743
commit 7a99f40
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 35 deletions.
diff --git a/src/chart/components/cross_tool/cross-tool.model.ts b/src/chart/components/cross_tool/cross-tool.model.ts
@@ -126,7 +126,7 @@ export class CrossToolModel extends ChartBaseElement {
 		} else {
 			this.currentHover.y = hover.y;
 		}
-		this.currentHover.paneId = CHART_UUID;
+		this.currentHover.paneId = hover.paneId;
 		this.currentHoverSubject.next(this.currentHover);
 	}
 }
diff --git a/src/chart/components/volumes/separate-volumes.component.ts b/src/chart/components/volumes/separate-volumes.component.ts
@@ -48,9 +48,10 @@ export class SeparateVolumesComponent extends ChartBaseElement {
 	 */
 	activateSeparateVolumes() {
 		if (this.paneManager.panes[SeparateVolumesComponent.UUID] === undefined) {
+			const precision = 1;
 			const volumePane = this.paneManager.createPane(SeparateVolumesComponent.UUID, {
 				paneFormatters: {
-					regular: volumeFormatter,
+					regular: (value: number) => volumeFormatter(value, precision),
 				},
 				useDefaultHighLow: false,
 				increment: 1,

diff --git a/src/chart/components/volumes/volumes.formatter.ts b/src/chart/components/volumes/volumes.formatter.ts
@@ -3,42 +3,38 @@
  * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
-
-import { NumberFormatLabels } from '../../utils/math.utils';
-
-const DEFAULT_PRECISION = 5;
-const MIN_VALUE = 0.0000000001;
-const TRAILLING_ZEROES_REGEXP = /\.?0+$/;
-const TRAILLING_FRACTION_WITH_ZEROES_REGEXP = /(\.[1-9]*)0+$/;
-
-export const volumeFormatter = (value: number): string => {
-	const formatValue = (value: number, amountToCut?: NumberFormatLabels): string => {
-		const rounder = Math.pow(10, DEFAULT_PRECISION);
-		const roundedValue = Math.round(value * rounder) / rounder;
-
-		if (roundedValue < 1 && roundedValue >= MIN_VALUE) {
-			return roundedValue
-				.toFixed(DEFAULT_PRECISION)
-				.replace(TRAILLING_ZEROES_REGEXP, '')
-				.replace(TRAILLING_FRACTION_WITH_ZEROES_REGEXP, '');
+export const volumeFormatter = (value: number, precision = 1) => {
+	function formatNumber(value: number): string {
+		let formattedResult: string;
+		const priceScale = Math.pow(10, precision);
+		value = Math.round(value * priceScale) / priceScale;
+		if (value >= 1e-15 && value < 1) {
+			formattedResult = value.toFixed(precision).replace(/\.?0+$/, ''); // regex removes trailing zeroes
 		} else {
-			return (roundedValue + '').replace(TRAILLING_FRACTION_WITH_ZEROES_REGEXP, '') + (amountToCut || '');
+			formattedResult = String(value);
 		}
-	};
-
-	if (Math.abs(value) > 999_999_999) {
-		value = Math.round(value / 1_000_000) * 1_000_000;
-		return formatValue(value / 1_000_000_000, 'B');
+		return formattedResult.replace(/(\.[1-9]*)0+$/, (e: string, p1: string): string => p1);
 	}
 
-	if (Math.abs(value) > 999_999) {
-		value = 1000 * Math.round(value / 1000);
-		return formatValue(value / 1_000_000, 'M');
-	}
-
-	if (Math.abs(value) > 9_999) {
-		return formatValue(value / 1000, 'K');
+	function format(value: number): string {
+		let sign = '';
+		if (value < 0) {
+			sign = '-';
+			value = -value;
+		}
+		if (value < 995) {
+			return sign + formatNumber(value);
+		}
+		if (value < 999995) {
+			return sign + formatNumber(value / 1000) + 'K';
+		}
+		if (value < 999999995) {
+			value = 1000 * Math.round(value / 1000);
+			return sign + formatNumber(value / 1000000) + 'M';
+		}
+		value = 1000000 * Math.round(value / 1000000);
+		return sign + formatNumber(value / 1000000000) + 'B';
 	}
 
-	return formatValue(value);
-};
+	return format(value);
+};