highcharts动态添加点

时间:2016-09-14 01:47:56

标签: javascript json highcharts web2py

我尝试使用以下代码每3秒向highcharts线图添加一个新点。但它并没有增加新的观点。 我证实了从json回来的那个点是正确的,如[x,y]。 没有getjson部分并且使用像[3,4]这样的点它可以工作。但是当我添加json时,它不会添加应该传递给json的新数据。

    var chart; // global        
       function requestData() {
           var series = this.series[0];

        $.getJSON('url', 
              function(point){

        // add the point

           series.addPoint(point);

        // call it again after one second

           setInterval(requestData, 3000); 

        }); 
        }

我加载requestData的方式如下,它适用于一个静态点添加。

chart: {
            zoomType: 'x',
            events: {
            load: requestData
        }

任何想法为什么函数不重复或不获取数据或者没有将数据放入点或addpoint不起作用?

我使用点击而不是加载,它工作正常。似乎定期加载不起作用。

编辑:完整图表代码:

    .getJSON('url2',
    function(data){   
    $('#container11').highcharts({
        chart: {
            zoomType: 'x',
            events: {
            load: requestData
        }


        },
        title: {
            text: ''
        },
        subtitle: {
            text: document.ontouchstart === undefined ?
                    'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in'
        },
        xAxis: {
            type: 'time',
            dateTimeLabelFormats: {
            hour: '%H:%M',
            }
        },
        yAxis: {
            title: {
                text: 'test'
            }
        },
        legend: {
            enabled: false
        },
        plotOptions: {
            area: {
                fillColor: {
                    linearGradient: {
                        x1: 0,
                        y1: 0,
                        x2: 0,
                        y2: 1
                    },
                    stops: [
                        [0, Highcharts.getOptions().colors[0]],
                        [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                    ]
                },
                marker: {
                    radius: 2
                },
                lineWidth: 1,
                states: {
                    hover: {
                        lineWidth: 1
                    }
                },
                threshold: null
            }
        },

        series: [{
            type: 'area',
            name: 'name',
            data: data
        }]
    });

});

1 个答案:

答案 0 :(得分:0)

我通过引入'var series = this.series [0];'来实现它。在'getjson'之后