2016-08-01 14 views
5

Graficzne nakładki na wykresy osi X C3, które są w formacie daty. Mam google tej kwerendy, ale nie dostał żadnego rozwiązania dla it.Is to możliwe, że c3 tylko pokazuje kilka czas data, a następnie pokazano całkowicie, w wyniku których nakładania etykiet osi x enter image description hereEtykieta C3 zachodząca na siebie na osi X

var data = { 
    x: 'x', 
    xFormat:'%Y-%m-%d/%H:%M', 
    empty: { 
     label: { 
      text: "No Data" 
     } 
    }, 
    columns: [ 
     ['x', '{$dateArray}'], 
     ['Attack', {$data}], 
    ],colors: { 
     Attack: '#67b7dc', 
    }, 
    types: { 
     Attack: 'area' 
    }}; 
var chart = c3.generate({bindto: '#chart1', 
size: { 
    height: 630, 
}, 
data: data, 
grid: { 
    x: { 
     show: true 
    }, 
    y: { 
     show: true 
    } 
}, 
tooltip: { 
    format: { 
     value: function (value, ratio, id) { 
      var format = value+' Gbps [ IP: '+destIp[value]+' ]'; 
      return format;    
     } 
    } 
}, 
zoom: { 
    enabled: true 
}, 
subchart: { 
    show: true 
},axis: { 
    x: { 
     type: 'timeseries', 
     tick: { 
      format: '%b %d, %H:%M', 
      rotate: 90, 
      multiline: false 
     } 
    }, 
    y: { 
     tick: { 
      format: function (d) { 
       return d.toFixed(3); 
      } 
     }, 
     label: { 
      text: 'Attack Size (Gbps)', 
      position: 'outer-middle' 
     } 
    } 
} 
}); 

Odpowiedz

2

Wpisz c3.js konfiguracja wykresu tick.count, ustaw ją na pożądaną wartość całkowitą, taką jak 2,3 lub 4.

Użyj c3.js Timeseries Chart exmaple, aby grać z tą konfiguracją.

problem bez tick.count: - enter image description here

problem rozwiązany tick.count konfiguracji: - enter image description here

+0

Niż @Chetan jego rozwiązali problem –