javascript - 人力车仅在某些点上显示网格线

Question

我有一张用人力车制作的图表：

我设置了刻度线，以便它们只有在值为 -24、0 或 24 时才有标签：

// Instantiate x-axis
var xAxis = new Rickshaw.Graph.Axis.X({
  graph: graph,
  orientation: 'bottom',
  pixelsPerTick: 25,
  element: graphXAxis,
  tickFormat: function(n) {
    switch(n) {
      case -24: return '24 hours ago';
      case 0: return 'Now';
      case 23: return '24 hours from now';
    }
  }
});

但是网格线出现在每一个刻度上，即使是我的案例语句没有返回的那些！我怎样才能摆脱其余的网格线？

Answer 1

您可以使用刻度键指定所需的刻度数。但是，这不会让您具体控制生成这些刻度的位置，并且您可能无法获得所请求的确切数字。通过对 RickShaw 的一些额外扩展，您可以获得对刻度的更多控制，详细信息请参见此处的支持代码。

var xAxis = new Rickshaw.Graph.Axis.X({
  graph: graph,
  orientation: 'bottom',
  pixelsPerTick: 25,
  ticks:3,
  element: graphXAxis,
  tickFormat: function(n) {
    switch(n) {
      case -24: return '24 hours ago';
      case 0: return 'Now';
      case 23: return '24 hours from now';
    }
  }
});