Gráficas
Profit/Loss Line Chart
Profit/Loss Line Chart: Un gráfico de líneas cuyo trazo cambia de color dependiendo de si el valor está por encima o por debajo de cero, dividiéndose limpiamente en cada punto de cruce.
Cómo usar Profit/Loss Line Chart
Profit/Loss Line Chart se presenta con el formato de vista previa «ancho» y el tema «oscuro».
Personalizar la vista previa
Estos controles se pasan a la demo. Los valores y límites describen la vista previa; consulta la implementación para conocer todas sus props.
| Control | Tipo | Valor inicial | Límites de la vista previa |
|---|---|---|---|
positiveColor | color | #34D399 | Los metadatos no indican otro límite. |
negativeColor | color | #F87171 | Los metadatos no indican otro límite. |
strokeWidth | number | 3 | De 1 a 6; paso 0.5 |
smooth | boolean | false | Los metadatos no indican otro límite. |
¿Para qué frameworks está disponible Profit/Loss Line Chart?
Profit/Loss Line Chart está disponible para React, Vue, Svelte, Astro, HTML. La vista previa usa React; las observaciones sobre el código corresponden a index.tsx. Revisa la versión elegida antes de asumir que ofrece las mismas interacciones.
¿Qué dependencias tiene Profit/Loss Line Chart?
Los metadatos de React indican estas dependencias npm además de React: motion, clsx, tailwind-merge.
¿Qué detalles de accesibilidad se observan en Profit/Loss Line Chart?
El código React de Profit/Loss Line Chart incluye: elementos nativos (button); atributos y manejadores (aria-hidden, aria-label, onKeyDown, tabIndex); roles explícitos (img); comparaciones de teclas (ArrowLeft, ArrowRight, Escape). Son observaciones del código. Comprueba los nombres accesibles, el orden del foco y el comportamiento del teclado en la página completa.
¿Cómo maneja Profit/Loss Line Chart el movimiento reducido?
Profit/Loss Line Chart consulta la preferencia de movimiento en su código React mediante useReducedMotion(). Expresiones de index.tsx que dependen de la preferencia: delay: reduce ? 0 : i * 0.06; duration: reduce ? 0 : 0.7. Revisa la implementación completa, los estilos compartidos y la versión elegida con movimiento reducido activado; estas observaciones no garantizan que se detengan todas las animaciones.