CODEWITHSUNDEEP
javascriptjqueryasp.nethighcharts
omer schleifer
omer schleifer

Reputation: 3935

Highcharts resize doesn't always work

I'm am using a framework called JDASH to draw floating user controls (which are actually update panels) and in them I am drawing highcharts. For some reason, sometimes when the update panel resizes, highcharts fails to resize in it. I tried calling resize:

var chartName = '<%= GetChartName() %>';
    $("#" + chartName.toString() + "_container").resize(function (e) {      
        //chartName.redraw();
    });

This helps in some cases, but in other cases this function is not called. Any idea on how to force highcharts to redraw?

Thanks, Omer

Upvotes: 0

Views: 369

Answers (2)

Yan
Yan

Reputation: 423

We had the same issue when the JDASH element its maximize button was clicked and fixed it with this:

The JDash element its View:

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

The javascript of the JDash element:

resize: function (event) {
      var container = $('.dashlet' + event.sender.id).find("#container");
      var chart = $(container).highcharts();

      chart.reflow();
}

Hope it helps someone in the future.

For the sake of completeness; it could be that you drag & drop your dashlet to a smaller or larger zone, which should also resize the chart. If so you'll need this code:

resize: function (event) {
    if (!event) { return true; }
    if (!event.sender) { return true; }

    var containerId;

    if (event.sender.id == "DDML_0") { // A dashlet container gets this class when it is being dragged.
        containerId = $(".dashlet" + event.args.pane.context.id);
    } else {
        containerId = $('.dashlet' + event.sender.id);
    }

    var container = $(containerId).find("#container");
    var chart = $(container).highcharts();

    if (!chart) { return true; }

    chart.reflow();

}

Upvotes: 0

Dan Esparza
Dan Esparza

Reputation: 28385

chart.series[0].setData(data,true);

The setData method itself will call the redraw method

Upvotes: 1

Related Questions