yii highcharts how to set date format in x-axis

Question

I have a line graph and I am trying to set date format in x-axis but it display time instead.

$this->Widget('ext.highcharts.HighchartsWidget', array(
    'options'=>array(
        'type'=>'spline',
        'title' => array('text' => 'Project Report'),
        'xAxis' => array(
            'type'=> 'datetime',
            'dateTimeLabelFormats'=>array( // don't display the dummy year
                'month'=> '%e %b',
                'year'=> '%y'
            ),
        ),
        'yAxis' =>array(
            'title' => array('text' => 'Percent %'),
            'min'=>0,
            'max'=>100
        ),
        'series' =>$series['series']                
    )
));

This displays the following picture

My series array:

$date_from = date("Y, m, d",strtotime($data->StartDATE) - 2*86400);
        $date_to = date("Y, m, d",strtotime($data->ProjectEndDate) + 2*86400);

$series['series'][] = array("name"=>$data->PROJECT,"data"=>array(array($date_from,0),array( date("Y, m, d",strtotime( date('Y-m-d') + + 2*86400) ) ,(int) 30),array( $date_to ,100 ))) ;

The output of this array is: Array ( [name] => Fastnet OffshWest Shetland [data] => Array ( [0] => Array ( [0] => 2013, 06, 09 [1] => 0 ) [1] => Array ( [0] => 2013, 06, 20 [1] => 30 ) [2] => Array ( [0] => 2013, 12, 13 [1] => 100 ) ) )

I have also tried

    $date_from = gmdate('d.m.Y H:i', strtotime($data->StartDATE) );
            $date_to = gmdate('d.m.Y H:i', strtotime($data->ProjectEndDate));
$series['series'][] = array("name"=>$data->PROJECT,"data"=>array(array($date_from,0),array( gmdate('d.m.Y H:i', strtotime( date('Y-m-d') ) ) ,(int) 30),array( $date_to ,100 ))) ;

Does not work either

Here is an example of what I want, however I am missing the enddate information. It is a gant chart. I would also like to include the enddate . Currently shows percentage complete from startdate . I also want to show how much it should be complete using current date in another color if possible.

Answer 1

As I already said, you have to use timestamps for your series :

$date_from = (strtotime($data->StartDATE) - 2*86400)*1000;
$date_to = (strtotime($data->ProjectEndDate) + 2*86400)*1000;

$series['series'][] = array(
    "name"=> $data->PROJECT,
    "data"=> array(
        array(
            $date_from,
            0
        ),
        array(
            (time() + 2*86400))*1000 ,
            30,
        array( 
            $date_to,
            100 
        )
    )
) ;

Multiply by 1000 for javascript.

Answer 2

Highcharts requires timestamp as x-value to show dates on xAxis. So instead od 2013, 06, 09 should be 1373328000000 (number).