Highcharts redraw diagrams

Nov. 17, 2017, 2:50 a.m.

Typically, highcharts graphics are automatically redrawn when the browser window is changed, but sometimes you need to forcefully redraw graph.

Intuition suggests you need to use .redraw() method, but, alas, it probably will not work (as it happended with me). For example, I had to redraw diagram after minimizing of left menu bar. When the menu collapses or unfolds, then width of div changes, and it need to automatically adjust the graphics to new width.

To redraw the highcharts diagrams, use .reflow() method:

$('..close').on('click.chart', function () {  // add click event on minimize menu button
    var $sb_chart = $('.sb_chart');
    $.each($sb_chart, function () {  // if there are several graphics
        var chart = $(this).highcharts();
        chart.reflow();
    });
})

Rate this article

5 from 5 (total 1 rating)

You can send feedback, suggestions or comments on this article using this form:

Fields marked by star ( * ) is required.

Thank you for yor feedback!

After clicking the "Send" button, your message will be delivered to me on the mail.

Author of Article

The right to use content on this page http://vivazzi.pro/en/it/redraw-highcharts/:

Permission is granted to copy an content with its author and reference to the original without using the parameter rel="nofollow" in tag <a>. Usage:

Author of Article: Maltsev Artem
Link to article: <a href="http://vivazzi.pro/en/it/redraw-highcharts/">http://vivazzi.pro/en/it/redraw-highcharts/</a>

More: Terms of site usage

Comments: 0

You can leave a comment as an unregistered user. But by registering, you will be able to receive notifications of replies, and also have access to your personal account to view your comments.

To comment in one's own name you should log in or sign up in the usual way or through social networks:

Send

There is no search on this site, so I offer to use usual search engine, for example, Google, adding "vivazzi" after your request.

Try it