如何减少flot graph和div容器之间的间距?

时间:2013-10-14 01:48:58

标签: javascript flot

如何删除此空白区域,如下面的屏幕截图所示(绿线)?

js代码如下:

$(function() {

    var d = [];
    var t = 1377655220 * 1000;
    for (var i=0;i<6;i++) {
        d.push([t+(i*60*1000), i*2]);
    }

    var data = [{
      label: "Packets",
      data: d
    }];
    var options = {
      colors: ['#F7A500'],
      legend: {
        labelBoxBorderColor: '#fff',
        backgroundOpacity:0
      },
      series: {
        lines: {
          show:true,
          lineWidth:3,
          fill:true
        },
        points: {
          show:true,
          fill: true,
          fillColor: '#F7A500'
        }
      },
      xaxis: {
        mode: 'time',
          tickSize: [1,'minute'],
        timeformat: "%m/%d <br> %H:%M"
      },
      yaxis: {
        tickSize: 2
      },
      grid: {
        borderWidth: 1,
        color: '#aaa',
        autoHighlight: true,
        mouseActiveRadius: 3,
        labelMargin: 15
      }
    };
    var plot = $('#placeholder').plot(data, options);
});

HTML:

<div id="placeholder" style="width:800px;height:300px;border:1px solid red;"></div>

Jsfiddle:http://jsfiddle.net/resting/hx6UJ/3/

Flot graph

1 个答案:

答案 0 :(得分:1)

如果您使用的是0.8,则可以尝试新的网格“边距”选项:

grid: {
    margin: {
        right: 0
    }
}

它可能不会完全删除保证金,但它会让你大部分都在那里。