2012-03-15 118 views
4

jqPlotを使って作業していて、誰かがウィンドウのサイズを変更したときにサイズ変更/再描画を行うかどうか疑問に思っていました。私は再描画機能があることを知っているが、本当にそれを呼び出す方法がわからない...誰かが私にこれを行う方法のいくつかのポインターを与えることができますか?ここでjqPlotを再描画する

は私のコードです:このコードとグラフ1、グラフがプロットされているdiv要素である前に

$.jqplot('chart1', [line1], { 
       title:'Users Per Day', 
       axes:{ 
       xaxis:{ 
        renderer:$.jqplot.DateAxisRenderer, 
        tickRenderer: $.jqplot.CanvasAxisTickRenderer , 
       // tickInterval:'1 week', 
        tickOptions:{ 
        formatString:'%b %#d, %y', 
        angle:-30 
        } 
       }, 
       yaxis:{ 
        tickOptions:{ 
        formatString:'%.1f' 
        } 
       } 
       }, 
       highlighter: { 
       show: true, 
       sizeAdjust: 7.5 
       }, 
       cursor: { 
        show: false 
        /*show: true, 
        zoom: true, 
        showTooltip: false */ 
       } 
      }); 

「LINE1は」人口の右のthats配列です。

アイデア?

おかげで、

クレイグ

+1

ここで前に応答します:http://stackoverflow.com/q/7212922/ – Aknosis

答えて

0

通常jqplotチャートは、チャートのdiv IDを保持している全領域を占めています。ですから、divのサイズを変更して、描画オブジェクトを再描画するチャートを再描画する方法を見つけてみてください。サイズ変更可能なプロット上の

8

このページは有用である:http://www.jqplot.com/deploy/dist/examples/resizablePlot.html

は、これは私が(私は一例として、あなたのコードを使用します)私が働いているプロジェクトのために、あなたの特定の問題を解決する方法である:

まず、変数にあなたのプロットを割り当てる:

plot = $.jqplot('chart1', [line1], { 
      title:'Users Per Day', 
      axes:{ 
      xaxis:{ 
       renderer:$.jqplot.DateAxisRenderer, 
       tickRenderer: $.jqplot.CanvasAxisTickRenderer , 
      // tickInterval:'1 week', 
       tickOptions:{ 
       formatString:'%b %#d, %y', 
       angle:-30 
       } 
      }, 
      yaxis:{ 
       tickOptions:{ 
       formatString:'%.1f' 
       } 
      } 
      }, 
      highlighter: { 
      show: true, 
      sizeAdjust: 7.5 
      }, 
      cursor: { 
       show: false 
       /*show: true, 
       zoom: true, 
       showTooltip: false */ 
      } 
     }); 

次に、あなたのページにこの機能を追加します。

$(window).resize(function() { 
     plot.replot({resetAxes: true }); 
    }); 

resetAxesがあると、軸を再スケールします(設定した最小/最大値は失われます)。 replotの詳細については、このページを参照してください:http://www.jqplot.com/docs/files/jqplot-core-js.html#jqPlot.replot

2

私はそれが画素毎に再プロット保持しませんが、むしろリサイズの終わりに

var timer; 
    $(window).resize(function() { 
     clearTimeout(timer); 
     timer = setTimeout(function() { 
      plot.replot({}); 
     }, 100); 
    }); 

を使用。

関連する問題