diff --git a/frontend/src/components/HistoricalChartWidget.tsx b/frontend/src/components/HistoricalChartWidget.tsx index 4304828..2666623 100644 --- a/frontend/src/components/HistoricalChartWidget.tsx +++ b/frontend/src/components/HistoricalChartWidget.tsx @@ -39,7 +39,7 @@ export const HistoricalChartWidget = ({ ticker, mercado, dias }: HistoricalChart const prices = data.map(p => p.precioActual); const dataMin = Math.min(...prices); const dataMax = Math.max(...prices); - const padding = (dataMax - dataMin) * 0.05; // 5% de padding + const padding = (dataMax - dataMin) * 0.5; // 5% de padding const domainMin = Math.floor(dataMin - padding); const domainMax = Math.ceil(dataMax + padding); @@ -49,6 +49,11 @@ export const HistoricalChartWidget = ({ ticker, mercado, dias }: HistoricalChart return `$${formatCurrency(tick)}`; }; + // 3. Calcular el ancho del eje Y dinámicamente + const maxLabel = yAxisTickFormatter(dataMax); + // Calculamos un ancho base + un extra por cada carácter en la etiqueta más larga. + const dynamicWidth = mercado === 'EEUU' ? 5 + (maxLabel.length * 4.5) : 15 + (maxLabel.length * 5); + return ( @@ -57,10 +62,11 @@ export const HistoricalChartWidget = ({ ticker, mercado, dias }: HistoricalChart [`$${formatCurrency2Decimal(value)}`, 'Precio']} + formatter={(value: number) => [`${formatCurrency2Decimal(value, mercado === 'EEUU' ? 'USD' : 'ARS')}`, 'Precio']} labelFormatter={formatTooltipLabel} />