如何在Highchart中在列和y軸之間有1px的空間？

我必須做一個柱狀圖，使用在柱子和Y軸之間有1px空間的highcharts，我怎樣才能將我想要的圖表中的1px空間添加到我所做的圖表中，這些就是我所做的代碼:(對不起，我沒有足夠的信譽來添加圖像，這就是爲什麼我沒有那麼發佈）如何在Highchart中在列和y軸之間有1px的空間？

var data = [ 20, 29, 25, 29, 21, 17, 20, 19, 18]; 
createMeasuresGraph(data, "quintals-sugar-graph"); 
function createMeasuresGraph(data, container) { 
    data[0] = { color: '#55B647', y: data[0] }; 
    data[data.length -2 ] = { color: '#F15B49', y: data[data.length -2 ] }; 
    var chart = new Highcharts.Chart({ 
     chart: { 
      marginBottom: 1, 
      marginLeft: 0, 
      marginRight: 0, 
      marginTop: 0, 
      renderTo: container, 
      type: 'column', 
     }, 
     credits: { 
      enabled: false 
     }, 
     legend: { 
      enabled: false 
     }, 
     plotOptions: { 
      column: { 
       pointWidth: 5, 
      }, 
      series: { 
       borderWidth: .1, 

      } 
     }, 
     series: [{ 
      data: data, 
      color: '#95D2F3', 
      shadow: false, 
     }], 
     title: { 
      text: '' 
     }, 
     tooltip: { 
      enabled: false 
     }, 
     xAxis: { 
      labels: { 
       enabled: false 
      }, 
      title: { 
       enabled: false 
      }, 
      lineColor: '#CBCBCB', 
      tickWidth: 0 
     }, 
     yAxis: { 
      endOnTick: false, 
      gridLineWidth: 0, 
      labels: { 
       enabled: false 
      }, 
      startOnTick: false, 
      minPadding: 0.5, 
      title: { 
       text: "" 
      } 
     } 
    }); 
}

我也看到這之間的空間是不是所有列一樣，也許我使用錯誤aproch來獲得空間，最好是什麼？

來源

2012-09-03 mkhuete

你想在每列之間有1px的空間嗎？

var colWidth = ($('#quintals-sugar-graph').width()/data.length) + 1;

然後設置「邊框寬度」爲1px以提供空間：

plotOptions: { 
     column: { 
      pointWidth: colWidth, 
      borderWidth: 1 
     }, 

    },

小提琴

我將基於列的情節/數的大小來計算的列的寬度here。

enter image description here

來源

2012-09-03 21:00:22 Mark

非常感謝你，這正是我想做的事 – mkhuete

你真的需要的寬度被精確地1像素？如果不是，下面還留下最小的空間列之間，並會更方便：

plotOptions: { 
    column: { 
     pointPadding: 0, 
     groupPadding: 0 
    } 
}

來源

2013-05-16 12:45:10 ricca

這必須是1px，因爲它在網頁設計師的設計中要求是這樣的，我知道有時候設計不能像pixelperfect – mkhuete

你可以簡單地做：

plotOptions: { 
    column: { 
    pointPadding: 0, 
    groupPadding: 0, 
    borderWidth: 1 
    } 
},

來源

2014-07-22 16:59:10 Zamith

如何在Highchart中在列和y軸之間有1px的空間？

回答

相關問題