0


网约车大数据综合项目——数据可视化Flask+Echarts

网约车大数据综合项目——数据可视化Flask+Echarts

第1关 使用饼图展示撤销订单理由最多的前10种理由

classConfig(object):#连接数据库########## Begin ##########
    SQLALCHEMY_DATABASE_URI ="mysql+pymysql://root:[email protected]:3306/trafficdb"
    SQLALCHEMY_TRACK_MODIFICATIONS =True########## End ##########
from app import  db
########## Begin ##########classcancelreason(db.Model):id= db.Column(db.Integer, primary_key=True, autoincrement=True)
    cancelreason = db.Column(db.String(50))
    num = db.Column(db.Integer)########## End ##########
from sqlalchemy.sql.elements import Cast
from app import db, app
from app.models.cancelreason import cancelreason
from flask import render_template, jsonify
@app.route("/cancelreasondata",methods=['POST'])defcancel_reason():########## Begin ##########
    cancelreasondata = cancelreason.query.order_by(cancelreason.num.desc()).all()
    list_ =[]for x in cancelreasondata:
        data={"cancelreason":x.cancelreason,"num":x.num
            }
        list_.append(data)return jsonify(list_)########## End ##########@app.route("/cancelreason",methods=['GET'])defhome1():return render_template("cancelreason.html")if __name__ =="__main__":
    app.run(debug=True, host="0.0.0.0", port=8080)
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>撤销订单理由top10</title></head><body><divid="main"style="height: 800px;width:1200px;background:white;margin:20px 0 0;"></div><scripttype="text/JavaScript"src="../static/echarts.min.js"></script><scripttype="text/JavaScript"src="../static/jquery.min.js"></script><scripttype="text/javascript">/********** Begin **********/$(document).ready(function(){var myChart = echarts.init(document.getElementById('main'));
        $.ajax({type:"post",async:true,url:"/cancelreasondata",dataType:"json",success:function(result){var cancelreasons =[];var data =[];for(var i =0; i < result.length; i++){
                    cancelreasons.push(result[i].cancelreason);
                    data.push({"value": result[i].num,"name": result[i].cancelreason});}
                option ={title:{text:'撤销订单理由top10',left:'center'},tooltip:{trigger:'item',formatter:'{a} <br/>{b} : {c} ({d}%)'},legend:{orient:'vertical',left:'left',data: cancelreasons
                    },series:[{name:'访问来源',type:'pie',radius:'55%',center:['50%','60%'],data: data,emphasis:{itemStyle:{shadowBlur:10,shadowOffsetX:0,shadowColor:'rgba(0, 0, 0, 0.5)'}}}]};
                myChart.setOption(option);},error:function(errorMsg){//请求失败时执行该函数alert("图表请求数据失败!");}});});/********** End **********/</script></body></html>

第2关:使用柱状图展示成功订单最多的10个地区

classConfig(object):#连接数据库########## Begin ##########
    SQLALCHEMY_DATABASE_URI ="mysql+pymysql://root:[email protected]:3306/trafficdb"
    SQLALCHEMY_TRACK_MODIFICATIONS =True########## End ##########
from app import  db
########## Begin ##########classorder_district(db.Model):id= db.Column(db.Integer, primary_key=True, autoincrement=True)
    districtname = db.Column(db.String(50))
    num = db.Column(db.Integer)########## End ##########
from sqlalchemy.sql.elements import Cast
from app import db, app
from app.models.order_district import order_district
from flask import render_template, jsonify
@app.route("/order_districtdata",methods=['POST'])deforder_districtdata():########## Begin ##########
    order_districtdata = order_district.query.order_by(order_district.num.desc()).all()
    list_ =[]for x in order_districtdata:
        data={"districtname":x.districtname,"num":x.num
            }
        list_.append(data)print(list_)return jsonify(list_)########## End ##########@app.route("/order_district",methods=['GET'])defhome2():return render_template("order_district.html")if __name__ =="__main__":
    app.run(debug=True, host="0.0.0.0", port=8080)
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>成功订单数量最高的地区top10</title></head><body><center><divid="main"style="height: 750px;width:1000px;background:white;margin:20px 0 0;"></div></center><scripttype="text/JavaScript"src="../static/echarts.min.js"></script><scripttype="text/JavaScript"src="../static/jquery.min.js"></script><scripttype="text/javascript">/********** Begin **********/$(document).ready(function(){var myChart = echarts.init(document.getElementById('main'));
        $.ajax({type:"post",async:true,url:"/order_districtdata",dataType:"json",success:function(result){var districtnames =[];var data =[];for(var i =0; i < result.length; i++){
                    districtnames.push(result[i].districtname);
                    data.push(result[i].num);}
                option ={title:{text:'成功订单数量最高的地区top10',left:'center'},color:['#3398DB'],tooltip:{trigger:'axis',axisPointer:{// 坐标轴指示器,坐标轴触发有效type:'shadow'// 默认为直线,可选为:'line' | 'shadow'}},grid:{left:'3%',right:'4%',bottom:'3%',containLabel:true},xAxis:[{type:'category',data: districtnames,axisTick:{alignWithLabel:true},axisLabel:{interval:0,formatter:function(value){return value.split("").join("\n");}},}],yAxis:[{type:'value'}],series:[{name:'成功订单数量',type:'bar',barWidth:'60%',data: data
                        }]};
                myChart.setOption(option);},error:function(errorMsg){//请求失败时执行该函数alert("图表请求数据失败!");}});});/********** End **********/</script></body></html>

第3关 在湖南省地图上用热力图展示各个市的订单数量

classConfig(object):#连接数据库########## Begin ##########
    SQLALCHEMY_DATABASE_URI ="mysql+pymysql://root:[email protected]:3306/trafficdb"
    SQLALCHEMY_TRACK_MODIFICATIONS =True########## End ##########
from app import  db
########## Begin ##########classorderbycity(db.Model):id= db.Column(db.Integer, primary_key=True, autoincrement=True)
    city = db.Column(db.String(50))
    num = db.Column(db.Integer)########## End ##########
from sqlalchemy.sql.elements import Cast
from app import db, app
from app.models.tb_orderbycity import orderbycity
from flask import render_template, jsonify
########## Begin ##########@app.route("/orderbycitydata",methods=['POST'])deforderbycitydata():
    orderbycitydata = orderbycity.query.order_by(orderbycity.num.desc()).all()
    list_ =[]for x in orderbycitydata:
        data={"city":x.city,"num":x.num
            }
        list_.append(data)print(list_)return jsonify(list_)@app.route("/orderbycity",methods=['GET'])defhome4():return render_template("orderbycity.html")########## End ##########if __name__ =="__main__":
    app.run(debug=True, host="0.0.0.0", port=8080)
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>湖南省各个城市订单数量</title></head><body><center><divid="main"style="height: 750px;width:1000px;background:white;margin:20px 0 0;"></div></center><scripttype="text/JavaScript"src="../static/echarts.min.js"></script><scripttype="text/JavaScript"src="../static/jquery.min.js"></script><scripttype="text/javascript">/********** Begin **********/$(document).ready(function(){
        $.ajax({type:"post",async:true,url:"/orderbycitydata",dataType:"json",success:function(result){var data =[];for(var i =0; i < result.length; i++){
                    data.push(data.push({"value": result[i].num,"name": result[i].city}));}var url = window.location.href;var myChart = echarts.init(document.getElementById('main'));
                myChart.showLoading();
                $.get(url.substring(0, url.lastIndexOf("/"))+'/static/hunan.json',function(geoJson){
                    myChart.hideLoading();
                    echarts.registerMap('hunan', geoJson);
                    myChart.setOption(option ={title:{text:'湖南省各个市网约车订单数量',left:'center'},tooltip:{trigger:'item',formatter:'{b}<br/>{c} (p / km2)'},toolbox:{show:true,orient:'vertical',left:'right',top:'center',feature:{dataView:{readOnly:false},restore:{},saveAsImage:{}}},visualMap:{min:5000,max:200000,text:['High','Low'],realtime:false,calculable:true,inRange:{color:['lightskyblue','yellow','orange','red']}},series:[{name:'湖南省各个市网约车订单数量',type:'map',mapType:'hunan',// 自定义扩展图表类型label:{show:true},data: data
                            }]});});},error:function(errorMsg){//请求失败时执行该函数alert("图表请求数据失败!");}});});/********** End **********/</script></body></html>

第4关 用折线图展示湖南省各个市在各个时间段的订单数量

classConfig(object):#连接数据库########## Begin ##########
    SQLALCHEMY_DATABASE_URI ="mysql+pymysql://root:[email protected]:3306/trafficdb"
    SQLALCHEMY_TRACK_MODIFICATIONS =True########## End ##########
from app import  db
########## Begin ##########classorder_city_hour(db.Model):id= db.Column(db.Integer, primary_key=True, autoincrement=True)
    hour = db.Column(db.String(50))
    city = db.Column(db.String(50))
    num = db.Column(db.Integer)########## End ##########
from sqlalchemy.sql.elements import Cast
from app import db, app
from app.models.order_city_hour import order_city_hour
from flask import render_template, jsonify
########## Begin ##########@app.route("/order_city_hourdata",methods=['POST'])deforder_city_hourdata():
    order_city_hourdata = order_city_hour.query.order_by(order_city_hour.city,Cast(order_city_hour.hour,db.Integer)).all()
    list_ =[]for x in order_city_hourdata:
        data={"hour":x.hour,"city":x.city,"num":x.num
            }
        list_.append(data)print(list_)return jsonify(list_)@app.route("/order_city_hour",methods=['GET'])defhome6():return render_template("order_city_hour.html")########## End ##########if __name__ =="__main__":
    app.run(debug=True, host="0.0.0.0", port=8080)
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>湖南省各个城市各个时间段订单数量</title></head><body><divid="main"style="height: 800px;width:1200px;background:white;margin:20px 0 0;"></div><scripttype="text/JavaScript"src="../static/echarts.min.js"></script><scripttype="text/JavaScript"src="../static/jquery.min.js"></script><scripttype="text/javascript">/********** Begin **********/$(document).ready(function(){var myChart = echarts.init(document.getElementById('main'));
        $.ajax({type:"post",async:true,url:"/order_city_hourdata",dataType:"json",success:function(result){var citys =[];var hours =[];var series =[];for(var i =0; i < result.length; i++){if(hours.indexOf(result[i].hour)===-1){
                        hours.push(result[i].hour);}if(citys.indexOf(result[i].city)===-1){var city = result[i].city;
                        citys.push(city);var data =[];for(var y =0; y < result.length; y++){if(result[y].city === city){
                                data.push(result[y].num);}}
                        series.push({"name": result[i].city,"type":"line","data": data});}}
                option ={title:{text:'湖南省各市每小时订单量'},tooltip:{trigger:'axis'},legend:{data: citys
                    },grid:{left:'3%',right:'4%',bottom:'3%',containLabel:true},toolbox:{feature:{saveAsImage:{}}},xAxis:{type:'category',boundaryGap:false,data: hours
                    },yAxis:{type:'value'},series: series
                };
                myChart.setOption(option);},error:function(errorMsg){//请求失败时执行该函数alert("图表请求数据失败!");}});});/********** End **********/</script></body></html>

第5关 用直方图展示全省在各个时间段的订单数量

classConfig(object):#连接数据库########## Begin ##########
    SQLALCHEMY_DATABASE_URI ="mysql+pymysql://root:[email protected]:3306/trafficdb"
    SQLALCHEMY_TRACK_MODIFICATIONS =True########## End ##########
from app import  db
########## Begin ##########classorder_quantity_time(db.Model):id= db.Column(db.Integer, primary_key=True, autoincrement=True)
    time = db.Column(db.String(50))
    num = db.Column(db.Integer)########## End ##########
from sqlalchemy.sql.elements import Cast
from app import db, app
from app.models.order_quantity_time import order_quantity_time
from flask import render_template, jsonify
########## Begin ##########@app.route("/order_quantity_timedata",methods=['POST'])deforder_quantity_timedata():
    order_quantity_timedata = order_quantity_time.query.order_by(order_quantity_time.time).all()
    list_ =[]for x in order_quantity_timedata:
        data={"time":x.time,"num":x.num
            }
        list_.append(data)print(list_)return jsonify(list_)@app.route("/order_quantity_time",methods=['GET'])defhome5():return render_template("order_quantity_time.html")########## End ##########if __name__ =="__main__":
    app.run(debug=True, host="0.0.0.0", port=8080)
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>湖南省某天订单详情</title></head><body><center><divid="main"style="height: 600px;width:1200px;background:white;margin:20px 0 0;"></div></center><scripttype="text/JavaScript"src="../static/echarts.min.js"></script><scripttype="text/JavaScript"src="../static/jquery.min.js"></script><scripttype="text/javascript">/********** Begin **********/$(document).ready(function(){var myChart = echarts.init(document.getElementById('main'));
        $.ajax({type:"post",async:true,url:"/order_quantity_timedata",dataType:"json",success:function(result){var categoryData =[];var valueData =[];for(var i =0; i < result.length; i++){
                    categoryData.push(result[i].time);
                    valueData.push(result[i].num);}var option ={title:{text:'湖南省某天订单详情',left:10},toolbox:{feature:{dataZoom:{yAxisIndex:false},saveAsImage:{pixelRatio:2}}},tooltip:{trigger:'axis',axisPointer:{type:'shadow'}},grid:{bottom:90},dataZoom:[{type:'inside'},{type:'slider'}],xAxis:{data: categoryData,silent:false,splitLine:{show:false},axisLabel:{formatter:function(value){return value.replace(" ","\n");}},splitArea:{show:false}},yAxis:{splitArea:{show:false}},series:[{type:'bar',data: valueData,// Set `large` for large data amountlarge:true}]};
                myChart.setOption(option);},error:function(errorMsg){//请求失败时执行该函数alert("图表请求数据失败!");}});});/********** End **********/</script></body></html>

本文转载自: https://blog.csdn.net/qq_52792570/article/details/130999414
版权归原作者 Wa_Automata 所有, 如有侵权,请联系我们删除。

“网约车大数据综合项目——数据可视化Flask+Echarts”的评论:

还没有评论