前沿

小编最近在开发可视化图表(HighCharts-Vue)过程中遇到一个奇葩的bug，highCharts的响应式图表只是在windows窗口变化时图表才会随之相应变化，但是当我用js操作父容器高宽时highCharts的响应式图表并不会随之响应。在此记录下来，以便于以后的开发，也希望可以帮助到遇到此坑的小伙伴们。

解决方案：

默认情况下，chart会伴随着window.resize事件自动地根据它所属于的container容器reflow，根据每个chart.reflow属性。但是，对于div的resize有却不会reflow，所以只能自己去监听div(父容器的变化)重新出发chart.setSize()方法，*******Vue中使用方法（先初始化let s = HighCharts.chart(this.id,this.option);然后s.setSize(appwidth,appheight);appwidth，appheight是监听div变化的数值，）*******不过官方推出的方法（chart.reflow）小编测试了一次下发现当你的图表设置为100%的时候每次reflow它是根据windows视窗去响应导致每次都会沾满全屏，所以此方法小编没有用。这样每次变化div的时候就可以做到响应式了。