Adding a point with animation results in weird behavior

When I try to add a point with animations in High Charts, it results in this weird behavior:

Highcharts.chart('container', {
    chart: {
        events: {
            load: function () {
                var animate = {duration: 5000};
                var series = this.series[0];
                setInterval(function () {
                    var x = (new Date()).getTime(), // current time
                    y = Math.random();
                    series.addPoint([x, y], true, true, animate);
                }, 5000);
            }
        }
    },

    xAxis: {
        type: 'datetime'
    },

    series: [{
        name: 'Random data',
        data: (function () {
            var data = [],
                time = (new Date()).getTime(),
                i;

            for (i = -19; i <= 0; i += 1) {
                data.push({
                    x: time + i * 1000,
                    y: Math.random()
                });
            }
            return data;
        }())
    }]
});

This is the behavior I would like to achieve but instead of taking 1 second to render, I would like each point to take 5 seconds to render. How can I achieve this?