flask+mysql+echarts实现数据可视化

最新推荐文章于 2024-05-30 23:32:12 发布

云计算大数据小朋友

最新推荐文章于 2024-05-30 23:32:12 发布

阅读量4.7k

点赞数 8

文章标签： python flask

本文链接：https://blog.csdn.net/qq_42040129/article/details/119485205

版权

flask+mysql+echarts实现数据可视化

Flask是一个Python编写的Web 微框架，让我们可以使用Python语言快速实现一个网站或Web服务。本文参考自Flask官方文档。内部wsgi实现采用werkzeug，模板引擎使用jinja2，使用BSD授权开源。

在行业中，flask也被称为微框架，因为flask使用简单的核心操作，通过extension增加额外的功能，并且flask没有默认的数据库和表单验证等支持。

使用pycharm新建一个Flask项目
数据库结构

读取数据库数据

data.py

import pymysql

def get_loan_number():
    connect = pymysql.Connect(
        host="数据库",
        port=3306,
        user="root",
        passwd="000000",
        db="student",
        charset='utf8'
    )
    print("---读取数据---")
    cursor = connect.cursor()  # 使用连接对象获得一个cursor对象
    sql = "select course,grade  from sys_grade"
    cursor.execute(sql)  # 用于执行返回多个结果集、多个更新计数或二者组合的语句。
    number = cursor.fetchall()  # 返回多个元组，即返回多个记录(rows),如果没有结果 则返回 ()
    temp_data = []
    loan_count = 0
    for loanNumber in number:
        loan_count += 1
        temp_data.append(loanNumber)
    data11 = dict(temp_data)
    # print(data11)
    cursor.close()
    connect.close()
    print("读取完成,共有%d条数据……" % loan_count)
    return data11

在这里插入图片描述

通过链接: echarts下载模板，这里我们弄一个简单的柱形图就可以了

在这里插入图片描述
5. 编写主程序，绑定视图函数

app.py

# 引入核心模块
from flask import Flask, render_template

from data import get_loan_number
# 通过当前文件构建一个app应用，当前文件就是web和App的入口
app = Flask(__name__)

# 定义视图处理函数加载到App中（路由+视图函数）
@app.route('/') # 访问路由
def hello_world(): # 绑定的视图函数
    temp_data = get_loan_number()
    return render_template('bar-simple.html',map_data=temp_data)

if __name__ == '__main__':
    app.run()

5.我们要把echarts下载的文件放在template文件夹里面
在这里插入图片描述

我们接下来要做的就是将html里面的数据更换成数据库里面的，因为上面data.py里面已经获取到数据了，通过app.py已经绑定了视图函数，所以现在我们就直接用{% %}这个方法将数据传到html中，这样我们的数据就可以实现可视化了。

代码如下：

<!DOCTYPE html>
<html style="height: 100%">
<head>
    <meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script>

<script type="text/javascript">
    var dom = document.getElementById("container");
    var myChart = echarts.init(dom);
    var app = {};
    var option;
    option = {
        xAxis: {
            type: 'category',
            data: [{% for key in map_data %}
                '{{ key}}',
                {% endfor %}
            ]
        },
        yAxis: {
            type: 'value'
        },
        series: [{
            data: [{% for key in map_data %}
            '{{ map_data[key] }}',
                {% endfor %}
            ],
            type: 'bar'
        }]
    };

    if (option && typeof option === 'object') {
        myChart.setOption(option);
    }

</script>
</body>
</html>

将获取的值在html中直接遍历。

6.结果展示
在这里插入图片描述

数据可视化完成。

python插入mysql数据，代码如下

import pymysql


def mysql(name,course,grade):
    conn = pymysql.connect(host='0.0.0.0', user='root', password='000000', database='student', port=3306)
    cursor = conn.cursor()
    # 若id选择自动递增并为主键，可以设为null,让其自动增长。
    sql = """
    insert into sys_grade(student_id,name,course,grade) value(null,%s,%s,%s)
    """
    # name = 'Lily'
    # course = 'python'
    # grade = 88
    cursor.execute(sql, (name, course, grade))
    conn.commit()
    # print(cursor.execute("select * from sys_grade"))
    conn.close()

if __name__ == '__main__':
    name = input("姓名:")
    course = input("课程:")
    grade = input("成绩:")
    mysql(name, course, grade)

云计算大数据小朋友

关注

8
点赞
踩
131

收藏

觉得还不错? 一键收藏
打赏
3
评论
flask+mysql+echarts实现数据可视化

flask+mysql+echarts实现数据可视化Flask是一个Python编写的Web 微框架，让我们可以使用Python语言快速实现一个网站或Web服务。本文参考自Flask官方文档。内部wsgi实现采用werkzeug，模板引擎使用jinja2，使用BSD授权开源。在行业中，flask也被称为微框架，因为flask使用简单的核心操作，通过extension增加额外的功能，并且flask没有默认的数据库和表单验证等支持。使用pycharm新建一个Flask项目数据库结构读
复制链接

扫一扫