javascript - 如何从tornado web 调用javascript函数？

Question

我想用 smoothy js 制作一个实时图表。我的服务器是从tornado运行的，这是用python编写的。Smoothy 可以实时刷新图表。在python中，我渲染html文件，其中包括smoothy，但我不知道如何从python刷新数据(因为我的数据在SQL数据库中)有一个从 html 文件调用的函数:(称之为 ex.html)

  var line1 = new TimeSeries();
  var line2 = new TimeSeries();
  var i = 1;
  setInterval(function() {
    line1.append(new Date().getTime(), Math.random);
    line2.append(new Date().getTime(), Math.random());
  }, 1000);

如您所见，append 方法更新了我的图表，第二个参数是值(x 轴)。所以我的问题是:如何使用 smoothie 添加来自 Tornado 网络的信息？

这是我的 python 代码:

class MainHandler(tornado.web.RequestHandler):
    def get(self):
        self.render("ex.html")

def make_app():
    return tornado.web.Application([
        (r"/", MainHandler),
    ])

if __name__ == "__main__":
    app = make_app()
    app.listen(8888)
    tornado.ioloop.IOLoop.current().start()

如果我的描述不明白，请给我留言。谢谢您的回答!

Answer 1

例如，您可以将信息传递给您的模板

class MainHandler(tornado.web.RequestHandler):
    def get(self):
        data = {"x": "01/01/17", "y": 100}
        self.render("ex.html", data=data)

并在 html 模板中

line1.append({{ data["x"] }},{{ data["y"] }} )

这只是一个简单的示例，请查看模板文档以获取更复杂的示例，例如使用循环。

这种方式是静态的，对于ajax来说可以，这里是一个例子。

<script type="text/javascript">
        setInterval(function() {
        $.getJSON("/stats",function(data){
        line1.append(data.time, data.in);
        line2.append(data.time, data.in);
        });
        }, 1000);
</script>

class MainHandler(tornado.web.RequestHandler):
    def get(self):
        self.render("ex.html")

class Stats(tornado.web.RequestHandler):
    def get(self):
        self.write({"time":"time","in":10})

def make_app():
    return tornado.web.Application([
        (r"/stats", Stats),
        (r"/", MainHandler),
    ])

if __name__ == "__main__":
    app = make_app()
    app.listen(8888)
    tornado.ioloop.IOLoop.current().start()