Estoy usando la función de format de formato d3 para redondear algunos números (sí, sé que esto no es necesario).
Cuando formateo números negativos, obtengo una cadena de un número negativo, como se esperaba. Sin embargo, cuando lo vuelvo a convertir en un número usando la abreviatura + , devuelve NaN . Esto no es lo que debería suceder. Debería obtener un número negativo regular.
import {format} from "d3-format"; //version 3.1.0 let numberFormatter = d3.format(".3f"); let neg = -2.333; let negString = "-2.333"; let d3negString = numberFormatter(neg); //the strings look the same console.log(d3negString) // "-2.333" console.log(negString) // "-2.333" //both strings have the same type of 'string' console.log(typeof negString === typeof d3negString); // true //but they are not equal console.log(negString === d3negString); // false //normal strings work as expected console.log(isNaN(+negString)); // false //but strings from d3-format function returns NaN console.log(isNaN(+d3negString)); // trueDice que ambas cadenas tienen el mismo tipo 'cadena', sin embargo, ¿sus valores no son iguales? ¿A pesar de que el texto es igual?
¿Cuál es el verdadero tipo de cadenas de números con formato d3? No pueden ser cadenas normales, ¿verdad? ¿Por qué está devolviendo NaN? ¿Es esto un error?
MacOS Big Sur Chrome 96.0.4664.110 d3-format@3.1.0El registro de cambios de d3 muestra que en la versión 2.0.0 se cambió lo siguiente:
Cambie el signo menos predeterminado por el signo menos (-) en lugar del guión menos (-).
En este hilo en el github de D3 hay algunos comentarios interesantes:
D3 usó originalmente el signo menos, pero la gente también se quejó de eso (p. ej., #595 ), principalmente porque se esperaba que d3.format usara el mismo símbolo que
number.toStringde JavaScript. Por lo tanto, el signo menos se reemplazó con el guión menos en 2.10.0 ( da3131c , #756 ).
Y:
Esto ahora está disponible como una opción si se especifica la propiedad
minusde la configuración regional. Y estoy considerando hacer que el signo menos sea el predeterminado (nuevamente) en la próxima versión principal.
La razón por la que esto no funciona es porque los caracteres 'menos', a pesar de parecer idénticos, son símbolos Unicode diferentes.
Afortunadamente, d3 proporciona una forma de cambiar el carácter menos predeterminado a lo que elija usando la función formatLocale .]
El carácter unicode 'GUIÓN-MENOS' U+002D se reconoce como un 'signo negativo'.
// import {format} from 'd3-format' //do not directly import format with default settings import { formatLocale} from "d3-format" const format = formatLocale({ minus: "\u002D"}).format let numberFormatter = d3.format(".3f"); let neg = -2.333; let negString = "-2.333"; let d3negString = numberFormatter(neg); console.log(d3negString) // "-2.333" console.log(negString) // "-2.333" console.log(typeof negString === typeof d3negString); // true console.log(negString === d3negString); // true console.log(isNaN(+negString)); // false console.log(isNaN(+d3negString)); // false La moraleja más grande de la historia es que el objetivo del formato d3 NO es redondear números, es hacer que el número se vea bien como texto . Para evitar problemas, use Math.round() o "-2.3333".toFixed(3) // => -2.333 para redondear números en javascript.