how to add xAxis.tick dynamically - highcharts

Question

I'm coding a dynamic chart (a monitor app) which xAxis is datetime type, every three seconds I pull data from DB and add new point for each serie (so far so good). The problem comes with tick, every time I add a new point all ticks take the current time instead of keeping their original value when they were created this is my code
var chart1Obj = {
chart: {
renderTo: 'welcome-chart',
type: 'line',
animation: Highcharts.svg, // don't animate in old IE
// marginRight: 10,
events: {
load: function () {
// set up the updating of the chart each second
var series = this.series;
setInterval(function () {
Meteor.call("getGraphData", function (error, json) {
if (error) {
console.error("Welcome.graphData() failed\n", error);
} else {
temp = JSON.parse(json);
series[0].addPoint([temp.running], true, true);
series[1].addPoint([temp.queued], true, true);
series[2].addPoint([temp.suspended], true, true);
}
});
}, 3000);
}
}
},
title: {
text: 'Job monitoring'
},
xAxis: {
type: 'datetime',
tickPixelInterval: 150,
labels: {
formatter: function () {
var myTime = new Date();
return Highcharts.dateFormat('%H:%M:%S', myTime.getTime());
}
}
},
yAxis: {
title: {
text: 'Number of Task'
},
floor: 0,
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
exporting: {
enabled: false
},
series: [{
name: 'Running',
data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
width: 1,
color: '#00FF00'
}, {
name: 'Queued',
width: 2,
data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
color: '#FFFF00'
}, {
name: 'Suspended',
width: 3,
data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
color: '#FF0000'
}]
};
Highcharts.setOptions({
global: {
useUTC: false,
}
});
var chart1 = new Highcharts.Chart(chart1Obj);
so the question is, what am I doing wrong? or what am I missing?

Answer 1

It's caused by this lines:
labels: {
formatter: function () {
var myTime = new Date();
return Highcharts.dateFormat('%H:%M:%S', myTime.getTime());
}
}
new Date() will create date object with actual time. Then you use that date for each label in tick labels. simply use:
return Highcharts.dateFormat('%H:%M:%S', this.value);