weixin_47700403 2020-05-10 19:52 采纳率: 0%
浏览 468

用python+falsk+mysql+echarts做数据可视化时,运行时出现404,该怎么解决问题?

错误如下:
图片说明图片说明

代码app.py如下

from flask import Flask,render_template,url_for
import json
import pymysql
from flask_sqlalchemy import SQLAlchemy
from wsgiref.simple_server import make_server
from gevent import pywsgi
app = Flask(__name__)
#--------------------------------------------------------------------------------------------------------------------

#关联数据库建表
app.config['SQLALCHEMY_DATABASE_URI']='mysql+pymysql://root:12345678@127.0.0.1:5000/qiche'
app.config['SQLALCHEMY_TRACK_MODIFCATIONS'] = False
db = SQLAlchemy(app)


@app.route('/template')
def hello_world():
    return render_template('../template/index.html')
@app.route('/test',methods=['GET'])
#链接数据库
def my_test():
    connection = pymysql.connect(host='localhost',user='root',passwd='12345678',db='qiche',port=3306,charset='utf8')

    # 为qiche的数据开启一个游标cur
    cur=connection.cursor()

    #访问sqiche表中的所有数据
    sql = 'SELECT * FROM test'

    #执行sql中的语句,即获取student表中的所有数据
    cur.execute(sql)

    #将获取到的sql数据全部显示出来
    see = cur.fetchall()

    #定义需要用上的空数据数组,然后通过遍历数据库的数据将数据附上去
    yxiaoliang = []
    ypinpai = []
    ychengjiaojia = []
    xname = []
    ynianfen = []
jsonData = {}

#遍历qiche表中的所有数据,see绑定了sql(也就是qiche表中的所有数据),所以需要在see中遍历
for data in see :
    ypinpai.append(data[0])
    xname.append(data[1])#data[1]是指qiche表中第二列()的数据
    ynianfen.append(data[2])
    yxiaoliang.append(data[3])#data[2]是指qiche表中第三列()的数据
    ychengjiaojia.append(data[4])#data[3]是指qiche表中第四列()的数据


#将数据转化格式方便在HTML中调用
jsonData['yxiaoliang'] = yxiaoliang
jsonData['ypaipin'] = ypinpai
jsonData['ychengjiaojia'] = ychengjiaojia
jsonData['xname'] = xname
jsonData['ynianfen'] = ynianfen

j = json.dumps(jsonData)
cur.close()
connection.close()
return (j)

if name == '__main__':
#server = make_server('127.0.0.1', 5000, app)
#server = pywsgi.WSGIServer(('127.0.0.1', 5000), app)
#server.serve_forever()
app.run(debug=True)



index.html代码如下

```<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>汽车销售</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
      <!-- 引入 echarts.js -->
    <script src="../static/jquery.min.js"></script>
    <!-- 引入jquery.js -->
    <script src="../static/echarts.min.js"></script>

</head>
<body>
    <div id="main" style="width: 1800px;height: 900px;"></div>

<script type="text/javascript">
    var myChart = echarts.init(document.getElementById('main'));

    var app={

         yxiaoliang : [],
         ypinpai : [],
         ychengjiaojia : [],
         xname : [],
         ynianfen : [],


    };
    $(document).ready(function () {
        getData();
        //console.log(app.legname1);
        console.log(app.yxiaoliang);
        console.log(app.ypinpai);
        console.log(app.ychengjiaojia);
        console.log(app.xname);
        console.log(app.ynianfen);

    });
    function  getData() {
        $.ajax({
            url:'/test',
            data:{},
            type:'POST',
            async:false,
            dataType:'json',
            success:function (data) {
                app.yxiaoliang = data.yxiaoliang;
                app.ypinpai = data.ypinpai;
                app.ychengjiaojia = data.ychengjiaojia;
                app.xname = data.xname;
                app.ynianfen = data.ynianfen;

                myChart.setOption({
                    title:{
                        text:'各品牌销售情况'
                    },
                    tooltip:{},
                    legend:{
                        data:['销量','成交价',]
                    },
                    xAxis:{
                        data: app.xname

                    },
                    yAxis:{
                        type:'value'
                    },
                    series:[{
                        name:'销量',
                        type: 'bar',
                        data:app.yxiaoliang
                    },
                        {
                            name:'成交价',
                            type:'line',
                            data:app.ychengjiaojia
                        },
                        ]
                });





            },
            error:function (msg) {
                console.log(msg);
                alert('系统错误');
            }
        })

    }
</script>

</body>
</html>


求大佬解决

  • 写回答

1条回答 默认 最新

  • dabocaiqq 2020-09-25 14:51
    关注
    评论

报告相同问题?

悬赏问题

  • ¥60 版本过低apk如何修改可以兼容新的安卓系统
  • ¥25 由IPR导致的DRIVER_POWER_STATE_FAILURE蓝屏
  • ¥50 有数据,怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据,怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!
  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像,如何解决?