Flask+echarts可视化未来一周天气变化情况

Flask是一个基于Python开发并且依赖jinja2模板和Werkzeug WSGI服务的一个微型框架，对于Werkzeug本质是Socket服务端，其用于接收http请求并对请求进行预处理，然后触发Flask框架，开发人员基于Flask框架提供的功能对请求进行相应的处理，并返回给用户，如果要返回给用户复杂的内容时，需要借助jinja2模板来实现对模板的处理，即：将模板和数据进行渲染，将渲染后的字符串返回给用户浏览器。

“微”(micro) 并不表示你需要把整个 Web 应用塞进单个 Python 文件（虽然确实可以 ），也不意味着 Flask 在功能上有所欠缺。微框架中的“微”意味着 Flask 旨在保持核心简单而易于扩展。Flask 不会替你做出太多决策——比如使用何种数据库。而那些 Flask 所选择的——比如使用何种模板引擎——则很容易替换。除此之外的一切都由可由你掌握。如此，Flask 可以与您珠联璧合。

默认情况下，Flask 不包含数据库抽象层、表单验证，或是其它任何已有多种库可以胜任的功能。然而，Flask 支持用扩展来给应用添加这些功能，如同是 Flask 本身实现的一样。众多的扩展提供了数据库集成、表单验证、上传处理、各种各样的开放认证技术等功能。Flask 也许是“微小”的，但它已准备好在需求繁杂的生产环境中投入使用。

 

echarts一个开源的可视化图标工具

https://echarts.baidu.com/index.html

 

后台代码如下所示：

from  flask import Flask,render_template
from flask_sqlalchemy import SQLAlchemy

app=Flask(__name__)
class Config(object):
    SQLALCHEMY_DATABASE_URI="mysql://root:[email protected]:3306/author_book_py4"
    SQLALCHEMY_TRACK_MODIFICATIONS=True
app.config.from_object(Config)
db=SQLAlchemy(app)
class Temperature(db.Model):
    __tablename__="tbl_temperature"
    id=db.Column(db.Integer,primary_key=True)
    day=db.Column(db.String(64),unique=True)
    high_temperature=db.Column(db.Integer)
    lower_temperature=db.Column(db.Integer)
@app.route("/")
def index():
    #查询数据库
    temperature_list=Temperature.query.all()
    return render_template("temperature.html",temperature=temperature_list)

if __name__ == '__main__':
    db.drop_all()
    db.create_all()
    t1=Temperature(day="周日",high_temperature=7,lower_temperature=-2)
    t2=Temperature(day="周一",high_temperature=8,lower_temperature=-1)
    t3=Temperature(day="周二",high_temperature=8,lower_temperature=0)
    t4=Temperature(day="周三",high_temperature=11,lower_temperature=1)
    t5=Temperature(day="周四",high_temperature=10,lower_temperature=3)
    t6=Temperature(day="周五",high_temperature=9,lower_temperature=2)
    t7=Temperature(day="周六",high_temperature=10,lower_temperature=1)
    db.session.add_all([t1,t2,t3,t4,t5,t6,t7])
    db.session.commit()
    app.run(debug=True)

前端代码如下所示：

运行效果如下所示：