CSDN_ptt 2024-05-11 21:54 采纳率: 64.3%
浏览 2
已结题

python与flask的综合运用

python的flask web端代码运行失败,求指点

```python
from flask import Flask, render_template
import pandas as pd

app = Flask(__name__)

@app.route("/")
def main():
    try:
        # Read the Excel file
        data = pd.read_excel("one.xlsx")
        x = data['星期'].tolist()
        y = data['旅游人数'].tolist()
        # Pass the data to the HTML template
        return render_template('index.html', xaxis=x, data_all=y)
    except FileNotFoundError:
        return "Error: Excel file 'one.xlsx' not found."
    except Exception as e:
        return f"An error occurred: {str(e)}"

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


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基于echarts的读取csv文件</title>
<script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width:600px;height:400px;"></div>
<script type="text/javascript">
    var myChart = echarts.init(document.getElementById('main'));

    var option = {
          xAxis:{
          type:'category',
          data:{{xaxis}}
          },
          yAxis:{
          type:'value',
          name:'all'
          },
          series:[
          {
          type:'bar',
          name:'all',
          data:{{data_all}}
          }
          ]
    };
   myChart.setOption(option);

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


img


python的运行结果为:

img


img


  • 写回答

4条回答 默认 最新

  • 笑面虎 2024-05-11 21:54
    关注

    以下内容由CHATGPT及笑面虎共同生成、有用望采纳:


    【您想要解决的问题】:您想要解决的问题是在使用Python的Flask框架和ECharts库来读取本地Excel文件并展示数据时,遇到了代码运行失败的问题。

    【图片内容】:

    1. 第一张图片显示了您的Python Flask应用程序的代码片段,其中包括了Flask应用的初始化、路由定义以及尝试读取Excel文件并渲染到HTML模板的过程。
    2. 第二张图片展示了您运行Python脚本后,Flask开发服务器的启动信息,包括服务器地址、调试模式开启以及两次成功的HTTP GET请求。
    3. 第三张图片显示了一个错误消息,指出在尝试访问index.html时发生了错误。

    【问题出现原因】:根据您提供的代码和图片,问题可能出现在以下几个方面:

    • Flask应用可能没有正确地找到或渲染index.html模板文件。
    • 在HTML模板中,传递给ECharts初始化函数的JavaScript对象可能没有正确解析。

    【问题解决方案】:为了解决这个问题,我们可以采取以下步骤:

    1. 确保index.html文件位于Flask项目的正确路径下,通常是在templates文件夹中。
    2. 修改HTML模板中的JavaScript代码,以确保传递给ECharts的数据格式正确。

    【提供代码】:以下是修改后的代码示例:

    # 确保index.html位于templates文件夹中
    
    <!-- 修改后的index.html -->
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>基于echarts的读取csv文件</title>
        <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
    </head>
    <body>
    <div id="main" style="width:600px;height:400px;"></div>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('main'));
    
        // 确保xaxis和data_all是JSON格式的字符串
        var option = {
            xAxis: {
                type: 'category',
                data: {{ xaxis|tojson }}
            },
            yAxis: {
                type: 'value',
                name: 'all'
            },
            series: [{
                type: 'bar',
                name: 'all',
                data: {{ data_all|tojson }}
            }]
        };
        myChart.setOption(option);
    </script>
    </body>
    </html>
    

    【代码运行方式】:您需要在具有Flask和Pandas库的环境中运行Python代码。如果您还没有设置环境,可以使用以下命令来安装所需的库:

    pip install flask pandas
    

    然后,在命令行中运行Python脚本:

    python a.py
    

    【代码预期运行结果】:

    # 假设Excel文件中的数据是正确的,并且index.html模板文件位于正确的位置,预期的运行结果是:
    # Flask开发服务器会在本地5000端口启动,并且您可以通过浏览器访问 http://127.0.0.1:5000 来查看图表。
    # 页面将显示一个基于ECharts的柱状图,展示了Excel文件中的数据。
    

    【推荐相关链接】:

    • Flask官方文档:https://flask.palletsprojects.com/
    • ECharts官方文档:https://echarts.apache.org/en/index.html
    • Pandas官方文档:https://pandas.pydata.org/pandas-docs/stable/index.html
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 5月19日
  • 已采纳回答 5月11日
  • 创建了问题 5月11日