javascript - drill - scroll highcharts

Highcharts: problema con el ancho total del gráfico

Question

Estoy usando el gráfico de columnas de Highcharts y quiero que sea un gráfico con un ancho del 100%. El contenedor es un simple <div> sin formato alguno. Cuando el documento se carga, el cuadro siempre tiene un ancho fijo de 600x400 px. Si cambio el tamaño de la ventana o cambio a otra pestaña del navegador, el gráfico ocupará el ancho y se convertirá en un gráfico de ancho total receptivo tal como yo quería. Si vuelvo a cargar la página, se vuelve a fijar el ancho. Traté de establecer el ancho para el contenedor y el gráfico, sin embargo, nada ayuda. Si muevo el div del contenedor un nivel por encima del div principal, funciona. ¿Cómo hacer que el gráfico se convierta en ancho completo en la carga de la página también?

Gracias

Answer 1

El ancho del gráfico se toma de jQuery.width(container) , por lo que si tiene un gráfico en algunas pestañas ocultas o algo similar, el ancho no estará definido. En ese caso, se establecen el ancho y el alto predeterminados (600x400).

Answer 2

Sé que esta es una pregunta antigua, pero me encontré con el mismo problema y encontré otra solución que funciona muy bien.

A partir de Highcharts 4.1.5 (también podría estar en versiones anteriores), el objeto de chart tiene una función reflow() . Ver la documentación aquí .

reflujo ()

Refluye el gráfico a su contenedor. De forma predeterminada, el gráfico se redirige automáticamente a su contenedor después de un evento window.resize, según la opción chart.reflow. Sin embargo, no hay eventos confiables para el cambio de tamaño de div, por lo que si el contenedor se redimensiona sin un evento de cambio de tamaño de la ventana, esto debe invocarse explícitamente.

Espero que ayude a alguien más.