javascript - 如何将点添加到系列的开头，Highcharts

Question

我需要戏剧性地加分

1. 到最后
2. 从头开始，.

但保持数据长度不变

我用

 chart.series[i].addPoint(1 * 5, false, true);

实现#1

但是我找不到一个 API 来将点添加到从最后一个点移开的开头。

   $("#prev").click(function(){
        chart.xAxis[0].setCategories(['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas', 'Lemon']);

        for (var i = 0; i < chart.series.length; i++)
        {
            chart.series[i].data[4].remove(false);
            //TODO add point to the head
        }
       chart.redraw();
    });

这是 jsfiddle:http://jsfiddle.net/bvuWR/187/

Answer 1

问题解决者:

1. 更新类别以便在头部有一个新类别:
2. 通过 data[i].remove(false) 删除最后一个点
3. 通过以下方式向头部添加点:series[i].addPoint({x:headIndex,y:value},false,false)
4. chart.redraw()

这是演示:http://jsfiddle.net/wesu4daz/3/

和代码片段:

//add point to last
$('#add').off('click').on('click',function(){
    var next = parseInt($(this).attr('end'),10)+1;
    var prev =  parseInt($('#prev').attr('start'),10)+1;

    var chart = $('#container').highcharts();

    //IMPORTANT to update categories before add point to the head
    var newCategories = $.merge([],chart.xAxis[0].categories);
    newCategories.push('new'+(newCategories.length))
    chart.xAxis[0].setCategories(newCategories);

    chart.series[0].addPoint({x:next,y:next},false,true);//add to last
    chart.redraw();

    $(this).attr('end',next);
    $('#prev').attr('start',prev);

});

//remove last point and add point to head
$('#prev').off('click').on('click',function(){
    var next = parseInt($('#add').attr('end'),10)-1;
    var prev =  parseInt($('#prev').attr('start'),10)-1;
    var chart = $('#container').highcharts();
    console.log(chart.xAxis[0]);
    chart.series[0].data[3].remove(false);
    chart.series[0].addPoint({x:prev,y:prev},false,false);
    chart.redraw();

    $('#add').attr('end',next);
    $('#prev').attr('start',prev);
});