Obtengo valores repetidos del eje y con tickFormat d3.format('.1s'), es como si el número real fuera diferente, como si fuera una matriz de [6045678, 6223456, 6076887], pero cuando formateas los números obtendrás 6M 3 veces,
¿Cuál es la mejor solución para este problema? ¿Hay alguna función d3 para este problema o tenemos que crear una matriz de valores?
let yAxisValues = [6045678, 6223456, 6076887]; const yScale = d3.scaleLinear() .domain([d3.min(yAxisValues), d3.max(yAxisValues)]) .range([height, 0]) .nice(); let yAxis = d3.axisLeft(yScale) .tickPadding(7) .ticks(5) .tickFormat(d3.format(".1s"))Intente cambiar el número de precision de 1 a 2/3/4 y así sucesivamente en d3.format(".1s") para obtener lo que sea adecuado para usted.
let yAxisValues = [6045678, 6223456, 6076887]; let formatter = d3.format(".1s"); let formatter2 = d3.format(".2s"); let formatter3 = d3.format(".3s"); let formatter4 = d3.format(".4s"); yAxisValues.forEach((d) => console.log(formatter(d))); yAxisValues.forEach((d) => console.log(formatter2(d))); yAxisValues.forEach((d) => console.log(formatter3(d))); yAxisValues.forEach((d) => console.log(formatter4(d))); El código anterior se muestra a continuación. 6M 3 veces es lo que obtienes, el resto es después de cambiar la precision .