Geek Answers Handbook

How to resize a fleet chart when its containing div resizes

I am using the jQuery plugin of the fleet graphical library library, and I have not found a way to handle resizing the graph when it contains <div>resizes (for example, due to window resizing). When processing the onresize event, I made sure that the width and height of the containing one were <div>updated to the desired size, and then tried to call both setupGrid and draw a plot object, but without effect. I had some success with the approach of only deleting and reading the containing <div>and replacing the graph on it. However, it looks like you are stuck in endless resizing loops if I need to add other elements<div>into the document at the same time (for example, for tooltips for a chart), since I assume that they can trigger resizing as well? Is there a good way to handle this that I am missing?

(I also use ExplorerCanvas for IE to be able to use Flot if this might have anything to do with it. I haven't tried it in any other browsers yet)

+5
source share
5 answers

I found only binding to the resize event in the window, and working with the call works very well. For example, I have data and parameters stored in variables on a page. Then I set this to $ (document) .ready ():

$(window).resize(function() {$.plot($('#graph_div'), data, opts);});

+16
source

flot API, , , .

()

Flot     . setupGrid() draw()      - .      .

+6

. $.plot(), , , jQuery resize. , :

$(window).resize(function() {
    // erase the flot graph, allowing the div to shrink correctly
    $('#graph_div').text(''); 

    // redraw the graph in the correctly sized div
    $.plot($('#graph_div'), data, opts);
});
+3

- resize. : http://www.flotcharts.org/flot/examples/resize/

<script language="javascript" type="text/javascript" src="../../jquery.flot.resize.js"></script>
+2

, , , . <div> . ,

window.onresize = redrawFunc;  //redrawFunc removes and readds the containing div and replots

, , , , , redrawFunc .

jQuery

$(window).resize = redrawFunc;

, , redrawFunc, , . , .

0

More articles:


All Articles