python flask项目:python读取数据库sales_quarter = "select monthly,total_price from goods_train",其中monthly为日期(YYYY/MM形式),定义data[],将里面的monthly转换为季度date为单位并求出每年每季度的销售总额sales,然后将求出的date和sales存入data[],然后然后以json格式返回,在根据返回的data的数据用ajax赋值到echarts柱状图里,写出代码
时间: 2024-02-12 12:03:10 浏览: 68
基于Flask框架的实验楼项目源码:Flask_syl
好的,根据您的需求,我提供如下Python Flask项目的代码实现:
```python
from flask import Flask, jsonify
import pymysql
app = Flask(__name__)
@app.route('/')
def index():
# 从数据库中读取数据
conn = pymysql.connect(host='localhost', user='root', password='password', database='sales')
cursor = conn.cursor()
query = "select monthly,total_price from goods_train"
cursor.execute(query)
results = cursor.fetchall()
cursor.close()
conn.close()
# 处理数据,计算每年每季度的销售总额
data = {}
for result in results:
month = result[0]
year = int(month[:4])
quarter = (int(month[5:]) - 1) // 3 + 1
date = f'{year} Q{quarter}'
if date not in data:
data[date] = 0
data[date] += result[1]
# 将处理后的数据存入data列表中
data_list = []
for date, sales in data.items():
data_list.append({'date': date, 'sales': sales})
# 返回json格式的数据
return jsonify({'data': data_list})
if __name__ == '__main__':
app.run(debug=True)
```
这个代码实现了以下几个步骤:
1. 从数据库中读取所有的日期和销售额;
2. 根据日期计算出相应的季度,并计算每年每季度的销售总额;
3. 将处理后的数据存入列表中,并以json格式返回。
接下来,您可以使用以下的HTML代码和JavaScript代码来调用这个API接口,生成柱状图:
```html
<!DOCTYPE html>
<html>
<head>
<title>Sales Data Visualization</title>
<script src="https://cdn.jsdelivr.net/npm/echarts@5.2.1/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>
<body>
<div id="chart" style="width: 800px;height: 600px;"></div>
<script>
axios.get('/').then(res => {
const data = res.data.data;
const chart = echarts.init(document.getElementById('chart'));
const option = {
title: {
text: 'Sales Data Visualization'
},
xAxis: {
type: 'category',
data: data.map(item => item.date)
},
yAxis: {
type: 'value'
},
series: [{
data: data.map(item => item.sales),
type: 'bar'
}]
};
chart.setOption(option);
});
</script>
</body>
</html>
```
这个HTML代码使用了axios库来调用API接口,获取数据后使用echarts库生成柱状图。
阅读全文