Javascript C3图表生成班次图表

Question

我使用C3js图表生成如下所示的班次图表：

以下是我的数据格式：

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {

    let cell : MyCustomView = collectionView.dequeueReusableCellWithReuseIdentifier("your_reusable_identifier", forIndexPath: indexPath) as! CustomCellOneCollectionViewCell

    return cell
}

我尝试过类似的例子：JsFiddle。但它不能很好地运作。 想法我想创建一个像xAxis格式的条形图，如图像。

有人可以向我推荐数据或上面的班次图表等示例吗？

谢谢，

Answer 1

调整x轴标签位置的代码是正确的 只需将其投入使用并在绘制图表时调用。

请参阅此fiddle或此代码段：

var chart = c3.generate({
    ...
    onrendered: pushTheYearsDown,
    onresized: pushTheYearsDown
});

和

// push the years down
function pushTheYearsDown() {
  d3.selectAll('#chart .tick text tspan')[0].forEach(function (d) {
      var tspan = d3.select(d);
      if (!isNaN(Number(tspan.text())))
          tspan.attr('dy', '2em')
      else 
          tspan.attr('dy', '0.5em')
  });
}