- Centro de ayuda
- Solución de problemas
- Las gráficas o animaciones no se renderizan
Las gráficas o animaciones no se renderizan
Por qué una gráfica muestra una caja vacía, y qué hacer con los elementos interactivos.
Última actualización:
En esta página
Una caja vacía donde debería haber una gráfica
Las gráficas las dibuja un script dentro de un elemento canvas. Si la pantalla se vuelve a renderizar sin volver a ejecutar ese script —tras una recarga, un cambio de versión o un guardado—, el elemento sobrevive pero el dibujo no, y te queda una caja vacía.
Qué probar
- Recarga el proyecto. A menudo basta.
- Pide que se reconstruya la gráfica en esa pantalla.
- Pide una gráfica estática si lo único que hace falta es que se vea bien en un diseño: «Sustituye la gráfica por una versión estática en SVG». Las gráficas estáticas sobreviven a todos los guardados y exportaciones, que para un entregable de diseño suele ser lo que quieres.
Las animaciones no se reproducen
La misma causa de fondo. Los diseños se guardan como marcado, y el comportamiento que depende de que un script se ejecute en el momento justo no siempre sobrevive a una ida y vuelta. Para cualquier cosa con mucho movimiento, diseña aquí los frames estáticos e implementa el movimiento tras exportar.
Después de exportar
El código exportado contiene lo que había en la pantalla. Si una gráfica estaba en blanco en el lienzo, está en blanco en la exportación. Arréglalo antes de exportar, o conecta la biblioteca de gráficas de verdad en tu propia base de código, que es lo que vas a querer hacer de todas formas en cuanto muestre datos reales.
Informar del problema
Si una gráfica sale en blanco de forma consistente en una pantalla concreta, contacta con soporte con el enlace del proyecto y el nombre de la pantalla.
¿Te ha resultado útil este artículo?
Artículos relacionados
Una pantalla sale en blanco o vacía
Frames vacíos tras un plan, lienzo en blanco al abrir y pantallas que no renderizan nada.
Exportar código (HTML, React, Tailwind)
Exporta una sola pantalla o un proyecto entero como código de front end listo para producción.
Contactar con soporte
Cómo localizarnos y qué incluir para que podamos arreglarlo en la primera respuesta.