14

我有一个 Highcharts 面积图,X 轴上有字符串类别。我希望图表从 x 轴的最左边开始并在最右边结束,没有任何填充。在下图中,红色箭头显示了我想要去除的间距。如果没有文本类别,这很容易实现,但我似乎无法弄清楚。任何帮助表示赞赏,谢谢。

带有不需要的填充的图表

4

6 回答 6

15

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

但是如果你想保持简单并axis.categories以传统方式传递(我认为这是一种更好的方式),我建议你使用一个小技巧并重新定义一个Axis.init函数。在jsFiddle上试试。

UPD:我已经稍微更新了我之前的小提琴。检查出来。我认为您可以结合我所有的解决方案来获得更好的解决方案。

于 2012-10-07T19:30:09.677 回答
4

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

chart: {
         renderTo: 'chart1',
         type: 'area',
         spacingLeft: -21,      
         spacingRight: -21,      
         spacingBottom: 1
},
于 2012-10-24T08:01:56.197 回答
3

更简洁的解决方案是使用Highchart APIpointPlacement中提供的参考。

添加pointPlacement: 'on',你应该在做生意。(作为参考,这里是他们的例子 JSFiddle

于 2013-09-09T21:04:32.960 回答
3
xAxis: {
categories: ['cat1', 'cat2', 'cat3', 'cat4', 'cat5']
},
series: [
    {
      name: 'name of series',
      data: [0, 2, 0, 2, 0],
      pointPlacement: 'on',
    }
]

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

于 2020-06-24T12:55:12.513 回答
2

只需添加:

...
xAxis: {
  startOnTick: true,
  ...
},
...
于 2012-04-10T14:31:58.430 回答
0

您需要以下设置。

xAxis: {           
  plotLines: [{
    value: 0, 
    color: '#color'
  }],
  tickmarkPlacement: 'on'
},
yAxis: {           
  lineWidth: 0,
}
于 2012-10-04T12:53:42.107 回答