ObHighchartsBundle：自定义并正确设置xAxis与DQL查询的日期时间和间隔

I am using marcaube/ObHighchartsBundle in my Symfony project

In my controller, I have this code with my queries for the highchart/graphic:

$series = array(
                array(
                    'name'  => 'Conso ECS',
                    'type'  => 'spline',
                    'color' => '#003171',
                    'yAxis' => 1,
                    'data'  => $dataConsoECS, //first query from my repo
                ),
                array(
                    'name'  => 'Consommation Chaleur',
                    'type'  => 'spline',
                    'color' => '#049372',
                    'yAxis' => 1,
                    'data'  => $dataConsoChaleur, //second query from my repo
                ),
                array(
                    'name'  => 'Température extérieure',
                    'type'  => 'spline',
                    'color' => '#FAA945',
                    'data'  => $dataTemperatures, //third query from my repo
                ),
            );
            $yData = array(
                array(
                    'labels' => array(
                        'style'     => array('color' => '#FAA945'),
                    ),
                    'title' => array(
                        'text'  => 'Temperature',
                        'style' => array('color' => '#FAA945')
                    ),
                    'opposite' => true,
                ),
                array(
                    'labels' => array(
                        'style'     => array('color' => '#6C7A89')
                    ),
                    'gridLineWidth' => 0,
                    'title' => array(
                        'text'  => 'Consommation',
                        'style' => array('color' => '#6C7A89')
                    ),
                ),
            );

            $ob = new Highchart();
            $ob->chart->renderTo('newFlo'); // The #id of the div where to render the chart
            $ob->chart->type('linechart');
            $ob->title->text('Graphique à 3 échelles');
            $ob->xAxis->title(array('text'  => "Dates"));
            $ob->xAxis->categories($arrayResultHours); //my last query which return an array of datetimes 
            $ob->xAxis->type('datetime');
            $ob->yAxis($yData);
            $ob->series($series);

            return $this->render('MySpaceMyBundle:MyFolder:graphique.html.twig', array(
            'chartChoice' => $chartRender, 'chart' => $ob));
    }

This is the result I have:

Like you can see, all of my datetimes from the query are in my xAxis label and set automatically the interval. I just need to set my own interval hours per hours and make my datetime appears when I pass over my indexes of my series, like this example or here too.

As you can see, I have well my 3 series from a DQL. The las one concerning the datetimes is the time (the hour) where the conso are identified.

But, in fact, I'm trying to have this results on my xAxis:

y|
 |
 |
 |_____________________________________________
   00h00  01h00  02h00  03h00  to ......  23h00 

I don't want to have my datetimes where the conso are identified, but a day interval like I try to represent you just above.

So the xAxis label must have a day interval from 00h00 to 23h00 but my series must have to show my datetimes from my database. This is where I am lost, because I need to set an interval hours to hours, but my series have to point on a datetime from my query.

I have found this, but I did not find my solution yet. I need to parameter my xAxis like this?

$ob->xAxis->type('datetime');
$ob->xAxis->tickInterval((24 * 3600 * 1000));

Someone know how can I set correctly the xAxis with ObHighchartsBundle?

Remove categories from your chart:

$ob->xAxis->categories($arrayResultHours);. 

Now, set datetime type and tickInterval. The last and most important thing is that point should be an array of x and y. In js like this: [x, y], where x is timestamp in milliseconds and y is value (number).