Flask框架可视化模板


目录结构
在这里插入图片描述

models

__init__.py

from app.extensions import db

from .hot_work import HotWork
from .bigdata_work import BigDataWork
from .avg_money_city import AvgMoneyCity
from .avg_money_bigdata import AvgMoneyBigData
from .CityRestaurantNum import CityRestaurantNum

参考:https://www.jianshu.com/p/73f7fbf75183
我们可以在init.py 指定默认需要导入的模块

模型类.py

avg_money_bigdata.py

from app.extensions import db

class AvgMoneyBigData(db.Model):
    __tablename__ = 'avg_money_bigdata'
    id = db.Column(db.Integer, primary_key=True)
    city = db.Column(db.String(255))
    avg_money = db.Column(db.String(255))

    def __repr__(self):
        return f"<AvgMoneyBigData id:{
     self.id},city:{
     self.city},avg_money{
     self.avg_money}>"

avg_money_city.py

from app.extensions import db


class AvgMoneyCity(db.Model):
    __tablename__ = 'avg_money_city'
    id = db.Column(db.Integer, primary_key=True)
    city = db.Column(db.String(255))
    avg_money = db.Column(db.String(255))

bigdata_work.py

from app.extensions import db


class BigDataWork(db.Model):
    __tablename__ = 'bigdata_work'
    id = db.Column(db.Integer, primary_key=True)
    job_name = db.Column(db.String(255))
    company_name = db.Column(db.String(255))
    city = db.Column(db.String(255))
    job_require = db.Column(db.Text)
    recruit_number = db.Column(db.String(255))
    money = db.Column(db.String(255))
    skill_require = db.Column(db.String(255))
    release_date = db.Column(db.String(255))
    sex = db.Column(db.String(255))
    company_detail = db.Column(db.String(255))
    education = db.Column(db.String(255))

CityRestaurantNum.py

from app.extensions import db


class CityRestaurantNum(db.Model):
    __tablename__ = 'city_restaurant_num'
    id = db.Column(db.Integer, primary_key=True)
    restaurant_numb = db.Column(db.Integer)
    city = db.Column(db.String(20))

hot_work.py

from app.extensions import db


class HotWork(db.Model):
    __tablename__ = 'hot_work'
    id = db.Column(db.Integer, primary_key=True)
    job_name = db.Column(db.String(255))
    job_number = db.Column(db.Integer)

static

存放静态资源
在这里插入图片描述

templates

存放html文件,用于flask使用render_template渲染数据到html
在这里插入图片描述

views

__init__.py

from .main import main

# 蓝本配置

DEFAULT_BLUEPRINT = (

    (main, ''),
)


# 封装的函数完成蓝本注册

def config_blueprint(app):
    for blueprint, prefix in DEFAULT_BLUEPRINT:
        app.register_blueprint(blueprint, url_prefix=prefix)

main.py

from flask import Blueprint, render_template
from sqlalchemy import *

from app.extensions import db
from app.models import HotWork, BigDataWork, AvgMoneyCity, AvgMoneyBigData
from app.models import CityRestaurantNum

main = Blueprint('main', __name__)  # 实例化路由


def get_city_sale_vol():
    apri_rs = db.session.query(CitySaleApri.city, func.sum(CitySaleApri.sale_month).label('sales')).group_by(
        CitySaleApri.city)
    may_rs = db.session.query(CitySaleMay.city, func.sum(CithSaleMay.sale_month).label('sales')).group_by(CitySale.city)
    gcsv_rs = [apri_rs, may_rs]
    return gcsv_rs


# 没用到
def get_score_interval():
    gsi_rs = RestaurantScoreNum.query.all()
    return gsi_rs


def get_city_restaurant_number():
    gcrn_rs = CityRestaurantNum.query.order_by(desc('restaurant_numb')).all()
    return gcrn_rs


def get_total_foodtype_count(rs_sql):
    data_dict = {
   }
    numbers = []
    for rs in rs_sql:
        numbers.append(int(rs.number))
        data_dict['value'] = numbers
        data_dict['name'] = rs.city
    return data_dict


def get_foodtype_number():
    gfn_yt = db.session.query(RestaurantTypeCount).filter(RestaurantTypeCount.city == '烟台',
                                                          RestaurantTypeCount.foodtype.in_(
                                                              ['小吃快餐', '甜点饮品', '火锅', '烧烤烤肉', '西餐'])).all()
    gfn_ly = db.session.query(RestaurantTypeCount).filter(RestaurantTypeCount.city == '临沂',
                                                          RestaurantTypeCount.foodtype.in_(
                                                              ['小吃快餐', '甜点饮品', '火锅', '烧烤烤肉', '西餐'])).all()
    gfn_qd = db.session.query(RestaurantTypeCount).filter(RestaurantTypeCount.city == '青岛',
                                                          RestaurantTypeCount.foodtype.in_(
                                                              ['小吃快餐', '甜点饮品', '火锅', '烧烤烤肉', '西餐'])).all()
    gfn_jn = db.session.query(RestaurantTypeCount).filter(RestaurantTypeCount.city == '济南',
                                                          RestaurantTypeCount.foodtype.in_(
                                                              ['小吃快餐', '甜点饮品', '火锅', '烧烤烤肉', '西餐'])).all()
    gfn_sql = [gfn_yt, gfn_ly, gfn_qd, gfn_jn]
    gfn_rs = []
    for rs_sql in gfn_sql:
        result = get_total_foodtype_count(rs_sql)
        gfn_rs.append(result)
    return gfn_rs


@main.route('/index/')
def display():
    rs_gcsv = get_city_sale_vol()
    rs_gsi = get_score_interval()
    rs_gcrn = get_city_restaurant_number()
    rs_gfn = get_foodtype_number()
    return render_template('/main/echarts.html', rs_gcsv=rs_gcsv, rs_gsi=rs_gsi, rs_gcrn=rs_gcrn, rs_gfn=rs_gfn)

# @main.route('/')
# def index():
#     return render_template('/main/echarts.html')
#
#
# @main.route('/test')
# def test():
#     avg_money_bigdata_list = db.session.query(AvgMoneyBigData.avg_money).all()
#     avg_money_city_list = db.session.query(AvgMoneyCity.avg_money).all()
#     print(avg_money_bigdata_list)
#     print(avg_money_city_list)
#     return render_template('/main/main.html', test_value='test', avg_money_bigdata_list=avg_money_bigdata_list,
#                            avg_money_city_list=avg_money_city_list, data=[1, 2, 3, 4, 5])
#
#
# @main.route('/test2')
# def test2():
#     bar_data_object = AvgMoneyCity.query.group_by(AvgMoneyCity.avg_money).all()[0:5]
#     bigData_object = AvgMoneyBigData.query.group_by(AvgMoneyBigData.avg_money).all()[0:5]
#
#     bar_data = []
#     for data in bar_data_object:
#         bar_data.append(data.avg_money)
#     print(bar_data)
#     return render_template('/main/test2.html', bar_data=bar_data, bigData_object=bigData_object)


# @main.route('/index/')
# def display():
#     rs_ghw = get_hot_work()
#     rs_gbdw = get_big_data_work()
#     rs_gamc = get_avg_money_city()
#     rs_gamb = get_avg_money_BigData()
#
#     return render_template('/main/echarts.html', rs_ghw=rs_ghw, rs_gbdw=rs_gbdw, rs_gamc=rs_gamc, rs_gamb=rs_gamb)
#

# 统计招聘数量最多的前十热门职位 获取结果:
# def get_hot_work():
#     # sql: select * from hot_work = group by job_name limit 10
#     ghw_rs = HotWork.query.order_by(desc('job_name')).limit(10)
#     print(ghw_rs)
#     return ghw_rs
#
#
# # 所有城市招聘数据的平均工资
# def get_avg_money_city():
#     # sql: select * from avg_money_city
#     gamc_rs = AvgMoneyCity.query.all()
#     print('所有城市招聘数据的平均工资获取结果成功')
#     return gamc_rs
#
#
# # “大数据”相关职位所有城市招聘数据的平均工资
# def get_avg_money_BigData():
#     # sql: select * from avg_money_big_data
#     gamb_rs = AvgMoneyBigData.query.all()
#     print('“大数据”相关职位所有城市招聘数据的平均工资获取结果成功')
#     return gamb_rs
#
#
# # 对相同职位进行数量汇总,"大数据"相关职位招聘数量比较
# def get_big_data_work():
#     # sql: select job_name, count(*) from bigdata_work where job_name like '%大数据%' GROUP BY job_name
#     gbdw_rs = db.session.query(BigDataWork.job_name, func.count('*').label('job_count')) \
#         .group_by(BigDataWork.job_name).order_by(desc('job_count')).all()
#     print('"大数据"相关职位招聘数量:' + str(gbdw_rs))
#     return gbdw_rs

manage

import os
from app import create_app
from flask_script import Manager, Server
from flask_migrate import MigrateCommand

# 获取配置

config_name = os.environ.get('FLASK_CONFIG') or 'default'

# 创建flask 实例

app = create_app(config_name)

# 创建命令行启动控制对象

manager = Manager(app)

manager.add_command("runserver", Server(use_debugger=True))

# 添加数据库迁徙命令

manager.add_command('db', MigrateCommand)

# 启动项目

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

app子文件

app下面的__init__.py

  1. 通过create_app(config_name)函数创建app,并设置各种配置
  2. config_errorhandler(app)函数,设置404页面
from flask import Flask, render_template
from app.config import config
from app.extensions import config_extensions
from app.views import config_blueprint



# 封装一个方法,专门用于创建Flask实例
def create_app(config_name): # development
    # 创建应用实例
    app = Flask(__name__)
    # 初始化配置
    app.config.from_object(config.get(config_name) or config['default'])
    # 调用初始化函数
    config[config_name].init_app(app)
    # 配置扩展
    config_extensions(app)
    # 配置蓝本
    config_blueprint(app)
    # 错误页面定制
    config_errorhandler(app)
    # 返回应用实例
    app.app_context().push()
    return app


def config_errorhandler(app):
    # 如果在蓝本定制,只针对本蓝本的错误有效,
    # 可以使用app_errorhandler定制全局有效的错误显示
    @app.errorhandler(404)
    def page_not_found(e):
        return render_template('errors/404.html')

config.py

import os

base_dir = os.path.abspath(os.path.dirname(__file__))


# 通用配置
class Config:
    # 秘钥
    SECRET_KEY = os.environ.get('SECRET_KEY') or '123456'
    # 数据库
    SQLALCHEMY_COMMIT_ON_TEARDOWN = True
    SQLALCHEMY_TRACK_MODIFICATIONS = False

    # 额外的初始化操作,即使什么内容都没有写,也是有意义的
    @staticmethod
    def init_app(app):
        pass


# 开发环境   语法:mysql+pymysql://用户名:密码@ip:端口/数据库名
class DevelopmentConfig(Config):
    # SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:P@ssw0rd@172.16.1.2:3306/test2'
    SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:123456@192.168.162.100:3306/visiondata'


# 测试环境
class TestingConfig(Config):
    SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:root@192.168.172.101:3306/visiondata'


# 生产环境
class ProductionConfig(Config):
    SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:root@192.168.172.102:3306/visiondata'


# 配置字典
config = {
   
    'development': DevelopmentConfig,
    'testing': TestingConfig,
    'production': ProductionConfig
### 使用Flask框架实现数据可视化 #### 创建Flask应用 为了在Web环境中展示动态生成的图表,首先需要搭建一个基于Flask的应用程序。这涉及安装必要的依赖包以及编写基本的服务端逻辑。 ```bash pip install flask pandas echarts-canvas ``` 接着,在工作目录下创建名为`app.py`文件来定义服务入口: ```python from flask import Flask, render_template_string app = Flask(__name__) @app.route('/') def index(): return "Hello World!" if __name__ == '__main__': app.run(debug=True) ``` 这段简单的代码启动了一个监听于根路径(`/`)的基础HTTP服务器[^1]。 #### 集成ECharts进行前端渲染 为了让浏览器能够呈现复杂的统计图形,推荐采用JavaScript库——ECharts作为客户端绘图工具。它支持多种类型的图表绘制,并且易于集成到现有的HTML页面中去。 修改上述`index()`函数返回的内容如下所示: ```python template = ''' <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Simple Chart</title> <script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script> </head> <body> <div id="chart" style="width: 600px;height:400px;"></div> <script type="text/javascript"> var chartDom = document.getElementById('chart'); var myChart = echarts.init(chartDom); var option; option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [{ data: [120, 200, 150, 80, 70, 110, 130], type: 'bar' }] }; myChart.setOption(option); </script> </body> </html> ''' @app.route('/') def index(): return render_template_string(template) if __name__ == '__main__': app.run(debug=True) ``` 此段脚本构建了一张柱状图用于表示一周内每天的数据变化情况。 #### 动态传递数据给视图层 实际应用场景往往要求从后台获取实时更新的信息源。此时可以通过AJAX请求或其他异步通信机制向服务器索取最新资料集,再由JavaScript负责刷新DOM节点中的图表实例。 假设存在一组存储于数据库或API接口处的时间序列数值,则可以在路由处理器内部加入相应的业务处理流程,比如查询、计算平均值等操作;之后借助JSON格式响应体的形式传送给前端部分作进一步解析和展现[^2]。 对于更复杂的需求场景,还可以考虑引入模板引擎(如Jinja2)、ORM映射组件(SQLAlchemy)以及其他第三方扩展插件辅助完成整个项目的架构设计与功能实现[^3]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值