代码之家  ›  专栏  ›  技术社区  ›  Arun

如何在FLOT图中获得y轴最大范围

  •  1
  • Arun  · 技术社区  · 10 年前

    我想根据绘图数据更改y轴最大范围。所以当我绘制图形时,它会根据最大绘图数据动态分配y轴范围。

    目前,我没有在选项中定义Y轴的任何最大范围以实现上述目的。因此,它会根据数据绘图动态分配最大y轴范围

    这是我的上述实现代码

           var source = [];
           var options = {
             xaxis: {
              ...
             }
             yaxis: {
             min: 0,
             axisLabel: "Y",
             axisLabelUseCanvas: false,
             axisLabelFontSizePixels: 12,
             axisLabelFontFamily: "Verdana, Arial, Helvetica, Tahoma, sans-serif",
             axisLabelPadding: 15
            },
          }
    
          plotObj = $.plot($("#placeholder"), source, options) ;
    

    它工作良好,并动态分配y轴最大范围。但是,我已经包含了“jquery.flot.selection.js”插件来缩放所选区域。因此,它使用以下代码缩放到ranges.yaxis.from到rangess.yaxis.to

     $("#placeholder").on("plotselected", function(ev, ranges) {
      //clearInterval(protection_timer);
    
      axes_data = plotObj.getAxes(); //get plotted axis ranges
      axes_data.xaxis.options.min = ranges.xaxis.from ;   
      axes_data.xaxis.options.max = ranges.xaxis.to ;       
      axes_data.yaxis.options.min = ranges.yaxis.from;
      axes_data.yaxis.options.max = ranges.yaxis.to;     
    
      ...
      plotObj.setData(graphData);
      plotObj.setupGrid();
      plotObj.draw();
    });
    

    现在,当用户双击占位符区域时,我需要重新设置图表。但这一次,由于y轴最大范围未定义,因此不会重新设置。如何获取缩放前显示的y轴范围?请提出一些建议

    1 回复  |  直到 8 年前
        1
  •  0
  •   Raidri    10 年前

    扩展您的 plotselected 事件,此处为第二行:

    axes_data = plotObj.getAxes(); //get plotted axis ranges
    axes_data.yaxis.originalMax = axes_data.yaxis.max; // save max value
    axes_data.xaxis.options.min = ranges.xaxis.from;
    

    并且在 doubleclick 事件重置图形,添加相应的行:

    axes_data.yaxis.max = axes_data.yaxis.originalMax; // restore max value