如何从最左边的位置开始获取Highcharts X-Axis类别

Question

我有一张Highcharts区域图表，在X轴上有字符串类别。 我希望图表从x轴的最左边开始，到最右边结束，没有任何填充。在下图中，红色箭头表示我想摆脱的间距。如果没有文本类别，这很容易实现，但我似乎无法弄明白。 任何帮助表示感谢，谢谢。

Answer 1

您可以通过在轴上重新定义labels.formatter来获得所需的结果。 jsFiddle就在这里。

但是如果你想保持简单并以传统方式传递axis.categories（我认为这是一种更好的方式），我建议你使用一个小小的黑客并重新定义一个Axis.init函数。试试jsFiddle。

UPD：我稍微更新了我以前的小提琴。 Check it out。我认为你可以结合我所有的解决方案来获得更好的解决方案。

Answer 2

您可以使用spacingLeft和spacingRight来设置间距：

chart: {
         renderTo: 'chart1',
         type: 'area',
         spacingLeft: -21,      
         spacingRight: -21,      
         spacingBottom: 1
},

Answer 3

更干净的解决方案是使用Highchart API中提供的pointPlacement参考。

添加pointPlacement: 'on'，您应该开展业务。 （供参考，here is their example JSFiddle）

Answer 4

只需添加：

...
xAxis: {
  startOnTick: true,
  ...
},
...

Answer 5

xAxis: {
categories: ['cat1', 'cat2', 'cat3', 'cat4', 'cat5']
},
series: [
    {
      name: 'name of series',
      data: [0, 2, 0, 2, 0],
      pointPlacement: 'on',
    }
]

此解决方案对我有用，也许有帮助。我无法确定这是否适用于其他输入数据的方式。

Answer 6

您需要以下设置。

xAxis: {           
  plotLines: [{
    value: 0, 
    color: '#color'
  }],
  tickmarkPlacement: 'on'
},
yAxis: {           
  lineWidth: 0,
}