Highstock X axis (date-value) render incorrectly - highcharts

Question

I read the data from json file in the following format:
[
{
"date":"2014-10-27",
"open":23275,
"high":23275,
"low":23013,
"close":23143
},
{
"date":"2014-10-28",
"open":23190,
"high":23571,
"low":23190,
"close":23520
}
]
Follow is the code to render the chart:
<script type="text/javascript">
var myData;
var raw;
$(document).ready(function () {
$.ajax({
type:'get',
url:'hsi2.json',
success:function(data){
raw = jQuery.extend(true, {}, data);
myData = data;
var len = myData.length;
for(var i=0; i<len; i++)
myData[i].date = Date.parse(myData[i].date);
Highcharts.setOptions({
useUTC: false
});
createChart(myData);
}
});
});
function createChart(myData){
$('#chartdiv').highcharts('StockChart', {
rangeSelector: {
inputEnabled: $('#chartdiv').width() > 480,
selected: 1
},
title: {
text: 'HSI Daily'
},
xAxis: {
type: 'datetime',
labels: {
formatter: function () {
return Highcharts.dateFormat('%a %b %Y', this.value);
},
dateTimeLabelFormats: {
day: '%e. %b',
month: '%b \'%y',
year: '%Y'
}
}
},
series: [{
type: 'ohlc',
name: 'HSI',
data: myData,
turboThreshold: 100000
}]
});
};
</script>
The X-axis only render like: Thu Jan 1970 00:00 for each bar.
The date is not display properly. I tried a lot of ways to fix without success. The date is in time stamp format already.
I also tried to check Highcharts.chart[0].series[0].data[i].date is exactly the time stamp value of myData[i].date.
Please help.
Thanks in advanced.

Answer 1

I found the problem after comparing the example.
Instead of using myData[i].date, I use myData[i].x as the x-axis.
$.ajax({
type:'get',
url:'hsi2.json',
success:function(data){
myData = data;
var len = myData.length;
for(var i=0; i<len; i++)
myData[i].x = Date.parse(data[i].date);
Highcharts.setOptions({
useUTC: true
});
createChart(myData);
}
});