javascript - Highcharts X 轴新值

Question

我正在使用 highcharts 绘制柱形图，如下所示:

var chart;
var count = 0;
$(function () {
$(document).ready(function() {
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'graph',
            type: 'column',
            margin: [ 50, 50, 100, 80]
        },
        title: {
            text: 'Random Data'
        },
        xAxis: {
            categories: [
                'T1',
                'T2'
            ],
            startOnTick: true,
            endOnTick: true,
            labels: {
                rotation: -45,
                align: 'right',
                style: {
                    fontSize: '13px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Y-Axis'
            }
        },
        legend: {
            enabled: false
        },
        tooltip: {
            formatter: function() {
                return '<b>'+ this.x +'</b><br/>'+
                    'Tip is: '+ Highcharts.numberFormat(this.y, 1);
            }
        },
        series: [{
            name: 'Population',
            data: [34.4, 21.8],
            dataLabels: {
                enabled: true,
                rotation: -90,
                color: '#FFFFFF',
                align: 'right',
                x: 4,
                y: 10,
                style: {
                    fontSize: '13px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        }]
    });
 });

});

我添加了以下函数以便向图表添加新点

 function addPoints(name,acc)
 {
   var series = chart.series[0];
   series.addPoint(acc, false, true);
   categories = chart.xAxis[0].categories;
   categories.push(name+count);
   count++;
   chart.xAxis[0].setCategories(categories, false);
   chart.redraw();
 }

问题是每次我添加一个新点时，一列就会移出图表。我想保留图 TableView 中的所有列，因此当我添加新点时，图表只会缩小。

查看JSFiddle

提前致谢...

Answer 1

addPoint(对象选项，[ bool 重画]，[ bool 移位]，[混合动画]) 渲染时间后向系列添加一个点。

参数

选项:数字|数组|对象
点选项。如果选项是单个数字，则将具有该 y 值的点附加到系列中。如果是数组，则将分别解释为 x 和 y 值，或者在 OHLC 或烛台的情况下，解释为 [x, open, high ，低，接近]。如果它是一个对象，则应用 series.data 下概述的高级选项。

重绘: bool 值
默认为 true。添加点后是否重新绘制图表。添加多个点时，强烈建议将 redraw 选项设置为 false，并在添加点完成后显式调用 Chart.redraw()。

shift: bool 值
默认为 false。当 shift 为 true 时，一个点将从系列的开头移出，同时将一个点附加到末尾。使用此选项可实时图表监控一段时间内的值。

动画:混合
默认为 true。当为 true 时，图表将使用默认动画选项进行动画处理。动画也可以是具有持续时间和缓动属性的配置对象。

series.addPoint(acc, false, true);
                             /\ here's the problem, it should be false

引用

• http://api.highcharts.com/highstock#Series

Updated demo