如何在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的空间？

回答

相关问题