擺脫C3上的頂部/底部邊距/填充圖表

我有幾個圖表，我試圖緊貼在div中。我似乎無法使頂部/底部的白色空間消失。理想情況下，圖的頂部和底部的圖例將適合緊貼div。有任何想法嗎？我嘗試了填充選項，但它們似乎不影響特定的空白區域。擺脫C3上的頂部/底部邊距/填充圖表

var chart = c3.generate({ 
     padding: { 
      top: 0, 
      bottom: 0 
     }, 
     data: { 
      json: [{ 
      date: '2014-02-02', 
      download: 100, 
      total: 500 
      }], 
     keys: { 
      x: 'date', 
      value: ['why'] 
     } 
    }, 
    axis: { 
     x: { 
      type: 'timeseries', 
      tick: { 
       format: function (x) { 
       if (x.getDate() === 1) { 
         return x.toLocaleDateString(); 
       } 
       } 
      } 
     } 
    } 
});

CSS/JS黑客的歡迎！我希望它適合div，而不必指定高度，但如果指定高度是唯一的方法，我可以解決它。

任何幫助表示讚賞。

更新： 我經歷了c3.js，它看起來像這個被添加在JavaScript中有點靜態。我將不得不重構代碼來解決這個問題。

來源

2016-02-09 Spicy Koala

對於任何人想知道 - 這個空間來自於代碼C3的幾行代碼：

$$.margin = config.axis_rotated ? { 
    top: $$.getHorizontalAxisHeight('y2') + $$.getCurrentPaddingTop(), 
    right: hasArc ? 0 : $$.getCurrentPaddingRight(), 
    bottom: $$.getHorizontalAxisHeight('y') + legendHeightForBottom + $$.getCurrentPaddingBottom(), 
    left: subchartHeight + (hasArc ? 0 : $$.getCurrentPaddingLeft()) 
} : { 
    top: 0+ $$.getCurrentPaddingTop(), // for top tick text 
    right: hasArc ? 0 : $$.getCurrentPaddingRight(), 
    bottom: xAxisHeight + subchartHeight + legendHeightForBottom + $$.getCurrentPaddingBottom(), 
    left: hasArc ? 0 : $$.getCurrentPaddingLeft() 
};

您可以手動調整，或添加代碼，以允許零分保證金的情況。

來源

2016-02-10 17:04:49

擺脫C3上的頂部/底部邊距/填充圖表

回答

相關問題