const ManagerProductPortfolioChart = ({ data }) => { const managers = [...new Set(data.map(d => d.manager))]; const topN = 7; // Show top N groups, rest as 'Other' const processedData = managers.map(manager => { const managerGroups = data.filter(d => d.manager === manager) .sort((a, b) => b.share_percent - a.share_percent); const topGroups = managerGroups.slice(0, topN); const otherShare = managerGroups.slice(topN).reduce((sum, d) => sum + d.share_percent, 0); const managerData = { manager: manager }; topGroups.forEach(g => { managerData[g.nomenclature_group] = g.share_percent; }); if (otherShare > 0) { managerData['Прочее'] = otherShare; } return managerData; }); const allNomenclatureGroups = [...new Set(data.map(d => d.nomenclature_group))]; const topNomenclatureGroups = [...new Set(processedData.flatMap(d => Object.keys(d).filter(key => key !== 'manager')))]; const finalNomenclatureGroups = [...topNomenclatureGroups.filter(g => g !== 'Прочее').sort(), 'Прочее'].filter(g => g !== 'manager'); const colors = [CHART_1_COLOR, CHART_2_COLOR, CHART_3_COLOR, CHART_4_COLOR, CHART_5_COLOR, CHART_6_COLOR, '#8884d8', '#82ca9d', '#ffc658', '#ff7300', '#a4de6c', '#d0ed57', '#ffc658', '#a4de6c', '#d0ed57']; // More colors for groups return ( `${value}%`} style={{ fontSize: 12 }} label={{ value: 'Доля в выручке (%)', angle: -90, position: 'insideLeft', offset: -70, style: { textAnchor: 'middle', fill: FOREGROUND_COLOR } }} /> [`${value.toFixed(2)}%`, name]} contentStyle={{ backgroundColor: BACKGROUND_COLOR, borderRadius: 8 }} /> {finalNomenclatureGroups.map((group, index) => ( ))} ); };