jqplotブラウザのサイズを変更するときのグラフのサイズ変更

Question

ブラウザのサイズを変更するときにjqplotチャートを簡単に自動サイズ変更する方法はありますか？私はGoogleで探していて、何も見つかりませんでした。

Answer 1

jqplotsのサイズ変更については、hereを参照してください。それは、ブラウザのサイズが変更されたときに動作させるために

、window.resizeイベントで再プロット機能をバインドします

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

実行コード：

$(document).ready(function(){ 
 
    var plot1 = $.jqplot ('container', [[3,7,9,1,4,6,8,2,5]], {}); 
 
    
 
    $(window).resize(function() { 
 
      plot1.replot({ resetAxes: true }); 
 
    }); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/jquery.jqplot.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqPlot/1.0.8/jquery.jqplot.min.css"> 
 
     
 
<div id="container"></div>

Answer 2

Iをあなたがグラフにたくさんのオプションを持っているならば、replotを使っても一貫した結果が得られるとは限りません。ウィンドウのサイズ変更に対処するために複雑なグラフを表示する唯一の方法は、残忍にして破壊して再構築することです。

function() { 

    var plot; 

    var renderGraph = function() { 
     plot = $.jqplot('chartId', yourChartData, yourChartOptions); 
    } 

    renderGraph(); 

    var resizeGraph = function() { 
     if (plot) 
      plot.destroy(); 
     renderGraph(); 
    } 

    $(window).resize(function() { 
     resizeGraph(); 
    }); 
}