重绘jqPlot

Question

我正在使用一个jqPlot，并想知道是否有一种方法来调整/重绘它的时候有人改变窗口大小。我知道有一个重绘功能，但我不知道如何真正调用它...有人可以给我一些指导如何做到这一点？

这是我的代码：

$.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”是此代码和chart1前右填充的数组这就是为在图表绘制在div。

任何想法？

谢谢，

克雷格

Answer 1

通常jqplot图表占据该图表的div ID保持整个区域。因此，请尝试找到一种重新调整div大小的方法，并重新绘制调用绘图对象重绘的图表。

Answer 2

上可调整大小的地块本页面是有用的：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，它也会重新调整坐标轴（你确实会失去你可能设置的最小/最大值）。有关更多信息，请参阅此页面：http://www.jqplot.com/docs/files/jqplot-core-js.html#jqPlot.replot。

Answer 3

我用

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

因此它不会保持型重构每个像素，而是在调整大小结束。