diff --git a/src/views/pages/marketing/MarketingAnalysis.vue b/src/views/pages/marketing/MarketingAnalysis.vue index 4d4905c..da3fc87 100644 --- a/src/views/pages/marketing/MarketingAnalysis.vue +++ b/src/views/pages/marketing/MarketingAnalysis.vue @@ -1037,6 +1037,37 @@ const horizontalBarChartOptions = { } }; +const verticalBarChartInsideOptions = { + responsive: true, + maintainAspectRatio: false, + animation: { + duration: 500, + onComplete: (animation) => drawBarValues(animation.chart) + }, + plugins: { + legend: { display: false }, + tooltip: { + enabled: true, + callbacks: { label: (context) => `${context.formattedValue}%` } + } + }, + scales: { + y: { + display: false, + beginAtZero: true, + grid: { display: false } + }, + x: { + grid: { display: false }, + ticks: { + font: { size: 11, weight: '600' }, + color: '#64748b' + } + } + }, + layout: { padding: { top: 20, bottom: 0 } } +}; + const parsePercentageData = (obj) => { if (!obj || typeof obj !== 'object') return { labels: [], values: [] }; const labels = Object.keys(obj).map(k => k.replace(/_/g, ' ')); // Убираем _ из ключей @@ -1068,21 +1099,7 @@ const competitorsBarChartOptions = { } }; -const horizontalBarChartOptions = { - indexAxis: 'y', // <-- Делает график горизонтальным - responsive: true, - maintainAspectRatio: false, - layout: { padding: { right: 45 } }, - animation: { - duration: 500, - onComplete: (animation) => drawBarValues(animation.chart) - }, - plugins: { legend: { display: false } }, - scales: { - x: { display: false, beginAtZero: true }, // Скрываем ось X - y: { grid: { display: false } } - } -}; + const channelsBarChartOptions = { ...competitorsBarChartOptions,