Question

我需要autorefresh下面的load函数，这样我就不必手动刷新整个页面，仍然可以获得my_value的新值。如果我重新加载页面，图表就会从我不想要的地方开始。

我认为这会每5秒返回不同的值，但每5秒只会返回相同的值。

如何刷新此脚本并每5秒更新一次值？

有人能告诉我为什么不更新数据吗？

$(document).ready(function() {
    Highcharts.setOptions({
        global: {
            useUTC: false
        }
    });
    $(function() {
        var chart;
        $('#my_id').highcharts({
            chart: {
                type: 'spline',
                animation: Highcharts.svg, // don't animate in old IE
                marginRight: 10,
                events: {
                    load: function() {

                        // set up the updating of the chart each second
                        var series = this.series[0];
                        setInterval(function() {
                            var x = (new Date()).getTime();
                            // var y = {{my_value}}; // Math.random() * 100;
                            // series.addPoint([x, y], true, true);

                            $.ajax({
                                type: "GET",
                                url: "/get_data",
                                data: data, // your "template" data goes here
                                success: function(my_value) {
                                    var y = my_value;
                                    series.addPoint([x, y], true, true);
                                }
                            });
                        }, 5000);
                    }
                }
            }
        });
    });

});

这是Flask脚本：

conn = MySQLdb.connect(host=host,
                       user=username,
                       passwd=password,
                       db=database,
                       port=port)


@app.route('/', methods=['GET'])
def index():
    request.args.get('key', '')
    df = sqlio.read_sql(qry1, conn)
    value = df['count'][0]
    return render_template('index.html', my_value=value)

@app.route('/get_data', methods=['GET'])
def get_data():
    df = sqlio.read_sql(qry1, conn)
    value = df['count'][0]
    return value


if __name__ == '__main__':
    app.run(
        port=1114,
        host='0.0.0.0'
    )

Answer 1

您可以执行ajax调用来获取数据：

var x = (new Date()).getTime();
// get data from python script
$.ajax({
  type: "GET",
  url: "/get_data",
  data: data, // your "template" data goes here
  success: function(my_value) {
     var y = my_value;
     series.addPoint([x, y], true, true);
  }
});

在您的服务器中，让Flask获取数据：

@app.route('/get_data', methods=['GET'])
def get_data():
    df = sqlio.read_sql(query, conn)
    value = df['my_column'][0]
    return value

刷新Javascript以从Flask获取新值

1 个答案: