Highcharts – 关于完整图表宽度的问题
我正在使用Highcharts柱形图,我希望它是100%宽度响应图表。 容器是一个简单的<div>
,没有任何格式。 加载文档时,图表总是固定宽度600x400px大小。 如果我调整窗口大小或切换到另一个浏览器选项卡,图表将填充宽度并变成响应式全宽度图表,就像我想要的一样。 如果我重新加载页面,它又是固定的宽度。 我试图设置宽度容器和图表,但是,没有任何帮助。 如果我把容器div移到父div上面一层,它就起作用了。 如何使图表成为页面加载全宽还?
谢谢
图表的宽度取自jQuery.width(container)
,所以如果你有一些隐藏的标签或类似的图表,宽度将是未定义的。 在这种情况下,默认的宽度和高度被设置(600×400)。
我知道这是一个古老的问题,但我遇到了同样的问题,并find了另一个很好的解决scheme。
截至Highcharts 4.1.5(也可能在旧版本中), chart
对象具有reflow()
函数。 在这里查看文档。
回stream()
将图表重排到其容器。 默认情况下,根据chart.reflow选项,图表将自动重排到window.resize事件之后的容器中。 但是,对于div大小没有可靠的事件,因此如果容器没有调整窗口大小事件的大小,必须显式调用。
希望它可以帮助别人。