javascript - C3 graph overlapping x-axis label -


c3 graph overlap x-axis labels in date time format. have googled query didn't solution it.is possible c3 shows couple of date time rather showing altogether result in overlap x-axis labels enter image description here

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'         }     } } }); 

use c3.js chart config tick.count, set desired integer value 2,3 or 4.

use c3.js timeseries chart exmaple play config.

problem without tick.count:- enter image description here

problem solved tick.count config:- enter image description here


Comments