大佬们,为什么我的数据可视化图形出不来?

from flask import Flask,render_template

app = Flask(__name__)

fb = open(r'过滤后的mysql.csv', encoding='utf-8')
data = fb.readlines()
line = data[0].split(',')
# print(line)
print(line[3], line[4], line[13], line[17], "出租率")
cityMap = {}
for i in data[1:]:
    sum1 = i.split(",")
    province = sum1[3]
    city = sum1[4]
    sum2 = sum1[13]
    shouchu = sum1[17]
    bilv = int(shouchu) / int(sum2)
    if province+city in cityMap:
        cityList = cityMap[province+city]
        cityList[0] = cityList[0] + 1
        cityList[1] = cityList[1] + bilv
        cityMap[province+city] = cityList
    else:
        cityMap[province+city] = [1, bilv]

# print(cityMap)
# print(type(cityMap))
ccc = {}
for i in cityMap:
    sum = cityMap[i][1] / cityMap[i][0]
    ccc[i] = round(sum,2)
# print(ccc)
list1 = list(ccc.items())
# print(list1)
bbb = dict(sorted(list1,key=lambda x:x[1],reverse=True)) # 降序排序
list2 = list(bbb.items())[:10] # 取前10
#    bbb
aaa = dict(list2)
# print(aaa)
@app.route('/')
def hello_world():
    return render_template("hello.html",cityMap = aaa)

if __name__ == '__main__':
    app.run()
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>招聘数量最多的前十个热门职位</title>
    <script src="./echarts.js"></script>
</head>
<body>
    <div id="s" style="width: 800px;height: 600px;"></div>
    <script>
        var myChart=echarts.init(document.getElementById('s'));
        var option={
            color:['rgb(207,65,48)'],
            title:{
                text:'招聘数量最多的前十个热门职位',
                subtext:'柱状图',
                left:'center'
            },
            tooltip:{
                trigger:"axis",
                axisPointer:{
                  type: 'shadow'
              }
            },
            xAxis:{
                type:'category',
                axisLabel:{
                    interval:0,//横轴信息全部显示
                    rotate:30,//-15度角倾斜显示
                 },
                data:[
                     {%for key,value in cityMap.items()%}
                     '{{key}}',
                     {% endfor %}

                    ]

            },
            yAxis:{
                type:'value'
            },
            series:{
                type:'bar',
                barWidth:'60%',
                data:[
                     {%for key,value in cityMap.items()%}'{{ value }}',{%endfor%}

                    ]

            },
        };

        myChart.setOption(option);

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

这是网页出现的,为什么这样

重点检查hello.html看看

45行改为,可以看到错误信息

app.run(debug=True)
#or
app.debug = True