遇到一个奇怪问题，关于HighCharts的全局变量的。

椰果子 2013-07-10 09:40:51

最近在使用HighCharts的图表控件时，遇到了一个奇怪的问题，虽然算是解决了，但是没有搞明白为什么。恳求各位javascript高手不吝赐教。

以下是官网提供的例子，我自己稍微做了下修改，可以正常运行的。



<head runat="server">

    <title></title>

    <script src="../js/jquery-1.9.1.js" type="text/javascript"></script>

    <script src="../js/highChartJs/highcharts.js" type="text/javascript"></script>

<script type="text/javascript">

    var chart; //全局变量;



    //ajax获取数据并填充到图表中.

    function requestData() {

        $.ajax({

            url: 'testAshx.ashx',

            success: function (point) {

                var series = chart.series[0], shift = series.data.length > 20; // shift if the series is longer than 20

                var x = (new Date()).getTime();

                var y = Math.random();

                var pt = [x, y];

                // add the point

                chart.series[0].addPoint(pt, true, shift);



                // call it again after one second

                setTimeout(requestData, 1000);

            },

            cache: false

        });  

    }





//以下是载入图表部分;

$(document).ready(function () {

    chart = new Highcharts.Chart({

        chart: {

            renderTo: 'container',

            defaultSeriesType: 'spline',

            events: {

                load: requestData

            }

        },

        title: {

            text: 'Live random data'

        },

        xAxis: {

            type: 'datetime',

            tickPixelInterval: 150,

            maxZoom: 20 * 1000

        },

        yAxis: {

            minPadding: 0.2,

            maxPadding: 0.2,

            title: {

                text: 'Value',

                margin: 80

            }

        },

        series: [{

            name: 'Random data',

            data: []

        }]

    });

});

</script>

</head>

<body>

    <form id="form1" runat="server">

    <div id="container" style="width: 100%; height: 300px;">

    </div>

    </form>

</body>

</html>

问题就在那个requestData()之中，我把这个函数改成下面的，发现chart的值就为undefined了。我不明白为什么ajax调用后chart就可以识别，但是不用ajax的话，chart就是undefined的。这是javascript的原因还是HighCharts的原因啊，求高手赐教。



        function requestData() {

                    var x = (new Date()).getTime();

                    var y = Math.random();

                    var point = [x, y];

                    var series = chart.series[0], shift = series.data.length > 20; // shift if the series is longer than 20

                    // add the point

                    chart.series[0].addPoint(point, true, shift);

                    // call it again after one second

                    setTimeout(requestData, 1000);



        }

...全文