Update customizeTooltip

arman-boyakhchyan · arman-boyakhchyan · commit 0ea715194c08 · 2025-07-09T13:25:19.000+04:00
diff --git a/Vue/src/components/HomeContent.vue b/Vue/src/components/HomeContent.vue
@@ -34,9 +34,11 @@ function customizeTooltip(data: { value: number; seriesName: string }) {
     return { text: formatNumber(data.value, 'currency') };
   }
   const isValueAboveAverage = data.value > calculateAverageSpend();
-  const aboveText = `${formatNumber(data.value, 'currency')}\n${formatNumber(data.value - calculateAverageSpend(), 'currency')} above average spending.`;
-  const belowText = `${formatNumber(data.value, 'currency')}\n${formatNumber(calculateAverageSpend() - data.value, 'currency')} below average spending.`;
-  return { text: isValueAboveAverage ? aboveText : belowText };
+  if (isValueAboveAverage) {
+    return { text: `${formatNumber(data.value, 'currency')}\n${formatNumber(data.value - averageSpend.value, 'currency')} above average spending.` };
+  }
+
+  return { text: `${formatNumber(data.value, 'currency')}\n${formatNumber(averageSpend.value - data.value, 'currency')} below average spending.` };
 }
 
 const chartGradient = registerGradient('linear', {

Original file line number	Diff line number	Diff line change
`@@ -34,9 +34,11 @@ function customizeTooltip(data: { value: number; seriesName: string }) {`
`34`	`34`	`return { text: formatNumber(data.value, 'currency') };`
`35`	`35`	`}`
`36`	`36`	`const isValueAboveAverage = data.value > calculateAverageSpend();`
`37`		- const aboveText = `${formatNumber(data.value, 'currency')}\n${formatNumber(data.value - calculateAverageSpend(), 'currency')} above average spending.`;
`38`		- const belowText = `${formatNumber(data.value, 'currency')}\n${formatNumber(calculateAverageSpend() - data.value, 'currency')} below average spending.`;
`39`		`- return { text: isValueAboveAverage ? aboveText : belowText };`
	`37`	`+ if (isValueAboveAverage) {`
	`38`	+ return { text: `${formatNumber(data.value, 'currency')}\n${formatNumber(data.value - averageSpend.value, 'currency')} above average spending.` };
	`39`	`+ }`
	`40`	`+`
	`41`	+ return { text: `${formatNumber(data.value, 'currency')}\n${formatNumber(averageSpend.value - data.value, 'currency')} below average spending.` };
`40`	`42`	`}`
`41`	`43`
`42`	`44`	`const chartGradient = registerGradient('linear', {`