Flask可视化当当网书籍统计

base.html–(父模板页)


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
{#    <link rel="stylesheet" href="/static/css/bootstrap.css">#}
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

<!-- 可选的 Bootstrap 主题文件(一般不用引入) -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap-theme.min.css" integrity="sha384-6pzBo3FDv/PJ8r2KRkGHifhEocL+1X2rVCTTkUfGk7/0pbek5mMa1upzvWbrUbOZ" crossorigin="anonymous">

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
    <style>
        #top span{
            color:red;
        }
        h1{
          color: #2aabd2;
        }
    </style>
   {% block style %}

   {% endblock %}
</head>
<body>
<h1 align="center" >当当网书籍管理系统</h1>
<div id="top">
    <span class="glyphicon glyphicon-pencil">
    <a href="/analyseInfo">前五名出版数量</a></span>|
    <span class="glyphicon glyphicon-th-list">
    <a href="/">查看书籍信息</a></span>
</div>
<hr/>
{% block centent %}fo

{% endblock %}
</body>
</html>

indexhtml–(子模板页)

{% extends "base.html" %}
{% block centent %}
  <table class="table table-striped">
    <tr>
        <td>编号</td>
        <td>书名</td>
        <td>价格</td>
        <td>作者</td>
        <td>出版社</td>
        <td>出版日期</td>
        <td>评论数</td>
    </tr>
  {% for book in books %}
      <tr>
        <td>{{ book["BookId"] }}</td>
        <td>{{ book["Title"] |mysub}}</td>
        <td>{{ book["Price"] }}</td>
        <td>{{ book["Author"] |mysub }}</td>
        <td>{{ book["Press"] }}</td>
        <td>{{ book["PubTime"] }}</td>
        <td>{{ book["Rate"] }}</td>
    </tr>
  {% endfor %}

  </table>
{% endblock %}

analyseInfo.html–(子模板页)

{% extends "base.html" %}
{% block centent %}
    <script src="/static/js/echarts.min.js"></script>
    <div id="main" style="width: 1000px;height:500px;" ></div>
    <script type="text/javascript" >
      var myChart = echarts.init(document.getElementById('main'));
      // 指定图表的配置项和数据
      var option = {
        title: {
          text: '出版社出版数量'
        },
        tooltip: {},
        legend: {
          data: ['评论数']
        },
        xAxis: {
          data: {{ x |safe }}
        },
        yAxis: {},
        series: [
          {
            name: '评论数',
            type: 'bar',
            data: {{ y }}
          }
        ]
      };
      myChart.setOption(option);
    </script>
{% endblock %}

myconfig.py–(密钥)

DEBUG=True
SECRET_KEY=("132455" "")

Mysql.py–(连接数据库)

import pymysql
class mysql:
    def __init__(self):
# 建立连接
        self.conn=pymysql.connect(host="127.0.0.1",user="root",passwd="123456",db="test")
        # 基于连接得到游标
        self.cursor=self.conn.cursor(pymysql.cursors.DictCursor)#默认返回的是元组格式,DictCursor是字典格式
# 让游标执行sql语句
# 查询customer表
    def query(self,sql,args=None):
        self.cursor.execute(sql,args)
        # 通过游标对象的fetchall方法获取所有行
        result=self.cursor.fetchall()
        return result
        # 增删改的通用方法,args用于向sql语句中的%s传递数据
    def update(self,sql,args=None):
        # sql="delete from goods where goodsid=%s"
        result=self.cursor.execute(sql,args)
        if result>0:
            self.conn.commit() #提交
            return True
        else:
            return False

app.py–(视图函数运行)

from flask import Flask, render_template, request, redirect, flash
from flask_bootstrap import Bootstrap
from Mysql import mysql
import  pandas as pd
app = Flask(__name__)
app.config.from_pyfile("myconfig.py")
Bootstrap(app)

global rows
@app.route('/')
def index():
    global rows
    sqlunit = mysql()
    sql="select * from books "
    rows = sqlunit.query(sql)
    print(rows)
    return render_template("index.html",books=rows)

@app.template_filter("mysub")  #mysub是注册过滤器的名字
def mysubstr(title):
    #判断文字长度,如果超过15个,截取前15个文字,拼接...
    if  len(title)>15:
        return title[0:15]+"..."
    else:  #文字不大于15,返回原文字
        return  title


@app.route('/analyseInfo')
def analyseInfo():
    global rows
    df=pd.DataFrame(rows)
    newDf=df.groupby("Press").count()["BookId"].sort_values(ascending=False).head()
    print(list(newDf.index))
    print(list(newDf.values))
    return render_template("analyseInfo.html",x=list(newDf.index),y=list(newDf.values))


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

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值