Search code examples
javascriptphpsortingcanvasjs

x axis label sort in canvasjs

I am using canvasjs to display report chart.. now I am making a multiple report that will sort in. I have this code: PHP

foreach($report as $rid){
  $arr = getReportValue($rid);
  $canvas_bar_datas = '';
  foreach ($arr as $key => $value) {    
     $dsdate = strtotime($key);
     $dsdate = date('Y-m-d',$dsdate);
     $dddate = explode("-",$key);
     $mmonth = $dddate[1] - 1;
     $canvas_bar_datas .= '{ x: new Date('.$dddate[0].', '.$mmonth.', '.$dddate[2].'), y: '.$value.',},';
  }
}

Javascript

window.onload = function () {
    var chart = new CanvasJS.Chart("chartContainer",
    {
      title:{
        text: "Top Oil Reserves"
      },
      data: [

      {
        dataPoints: [
        <?php echo $canvas_bar_datas; ?>
        ]
      }
      ]
    });

now in my graph it looks like this: enter image description here

is it possible that I can sort the x axis label ? for now it looks like Jan 11 2015, Feb 01 2015, Feb 22 2015... Apr 05 2015, Apr 26 2015...

is it possible that I can make the labeling like: Jan 2015, Feb 2015, ... Apr 2015, Jun 2015...

I want to show only the month and the year of the graph and it will be sorted accordingly and no duplicate of the label.

I also tried the interval parameter of the graph but it seems it is int and base on reports counting.

any idea about this?

Solution

  • I get it now.. this solves the issue: axisX:{intervalType: "month", interval:1}