Как установить тик-текст оси x между полосой на гистограмме в c3.js или d3.js?

Question

js - очень хорошая библиотека, но у меня есть проблема: в моем графике каждый бар представляет собой значение, созданное между двумя часами, но текст тика находится под панелью, и я хочу получить его между баром!

мой тип оси х "тип: 'категория'" data = ['x', '01: 00 ', '02: 00', '03: 00 ', '04: 00', '05: 00 ', '06: 00']

Может кто-нибудь мне помочь? Спасибо заранее.

у меня есть: http://hpics.li/9fc4863

Я хочу: http://hpics.li/1fb1090

Answer 1

Вы можете преобразовать ось х до таймсерий и имеете значение, помеченное к фактической средней точке ваших диапазонов часов (12.30, 1.30 .. .)

var chart = c3.generate({ 
    data: { 
     x: 'x', 
     columns: [ 
      ['x', 
      new Date('2013-01-01T00:30'), 
      new Date('2013-01-01T01:30'), 
      new Date('2013-01-01T02:30'), 
      new Date('2013-01-01T03:30')], 
      ['data1', 30, 200, 100, 400] 
     ], 
     type: 'bar' 
    }, 
    axis: { 
     x: { 
      type: 'timeseries', 
      tick: { 
       format: '%H:%M', 
       values: [ 
        new Date('2013-01-01T00:00'), 
        new Date('2013-01-01T01:00'), 
        new Date('2013-01-01T02:00'), 
        new Date('2013-01-01T03:00'), 
        new Date('2013-01-01T04:00') 
       ], 
       rotate: -90 
      }, 
      height: 50 
     } 
    } 
}); 

Fiddle - http://jsfiddle.net/v4z45zzj/