chore: Better align backtesting charts

freqtrade · Dec 28, 2024 · d8a4f27 · d8a4f27
1 parent b413a90
commit d8a4f27
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 8 deletions.
diff --git a/src/auto-imports.d.ts b/src/auto-imports.d.ts
@@ -49,6 +49,7 @@ declare global {
   const defineComponent: typeof import('vue')['defineComponent']
   const defineStore: typeof import('pinia')['defineStore']
   const eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+  const echartsGridDefault: typeof import('./utils/charts/chartZoom')['echartsGridDefault']
   const effectScope: typeof import('vue')['effectScope']
   const exportForTesting: typeof import('./utils/formatters/timeformat')['exportForTesting']
   const extendRef: typeof import('@vueuse/core')['extendRef']
@@ -436,6 +437,7 @@ declare module 'vue' {
     readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
     readonly defineStore: UnwrapRef<typeof import('pinia')['defineStore']>
     readonly eagerComputed: UnwrapRef<typeof import('@vueuse/core')['eagerComputed']>
+    readonly echartsGridDefault: UnwrapRef<typeof import('./utils/charts/chartZoom')['echartsGridDefault']>
     readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
     readonly exportForTesting: UnwrapRef<typeof import('./utils/formatters/timeformat')['exportForTesting']>
     readonly extendRef: UnwrapRef<typeof import('@vueuse/core')['extendRef']>

diff --git a/src/components/charts/CumProfitChart.vue b/src/components/charts/CumProfitChart.vue
@@ -242,9 +242,7 @@ const cumProfitChartOptions: ComputedRefWithControl<EChartsOption> = computedWit
         },
       ],
       grid: {
-        left: '55',
-        right: '20',
-        bottom: 80,
+        ...echartsGridDefault,
       },
       dataZoom: [
         {

diff --git a/src/components/charts/MarketChangeChart.vue b/src/components/charts/MarketChangeChart.vue
@@ -77,6 +77,9 @@ const dailyChartOptions: ComputedRef<EChartsOption> = computed(() => {
         },
       },
     },
+    grid: {
+      ...echartsGridDefault,
+    },
     legend: {
       data: [CHART_MARKET_CHANGE],
       right: '5%',

diff --git a/src/components/charts/ProfitDistributionChart.vue b/src/components/charts/ProfitDistributionChart.vue
@@ -95,9 +95,10 @@ const chartOptions = computed((): EChartsOption => {
         position: 'left',
       },
     ],
-    // grid: {
-    // bottom: 80,
-    // },
+    grid: {
+      ...echartsGridDefault,
+      bottom: 50,
+    },
 
     series: [
       {

diff --git a/src/components/charts/TradesLogChart.vue b/src/components/charts/TradesLogChart.vue
@@ -111,8 +111,8 @@ const chartOptions = computed((): EChartsOption => {
       },
     ],
     grid: {
-      right: 50,
-      bottom: 80,
+      ...echartsGridDefault,
+      left: 80,
     },
     dataZoom: [
       {

diff --git a/src/utils/charts/chartZoom.ts b/src/utils/charts/chartZoom.ts
@@ -8,3 +8,9 @@ export const dataZoomPartial = {
   handleIcon,
   handleSize: '80%',
 };
+
+export const echartsGridDefault = {
+  left: '55',
+  right: '30',
+  bottom: 80,
+};