Add upload.jpg

app.py

@@ -0,0 +1,173 @@
+from flask import *
+from flask import Flask
+from spider import *
+from word import makeWordcloud
+from pypinyin import lazy_pinyin,load_single_dict
+
+app = Flask(__name__)
+datalist = []
+movieScore = []
+num = []
+page=[1,2,3,4,5,6,7,8,9,10]
+@app.route('/')
+def index():
+    return render_template('first.html')
+
+@app.route('/first')
+def first():
+    return index()
+
+@app.route('/movie')
+def movie():
+    if len(datalist) == 0:
+        baseurl = "https://movie.douban.com/top250?start="  # 指定的网页超链接
+        datalist1 = getData1(baseurl)  # 返回一个装有所有数据的列表
+
+        print(datalist1)
+        for item in datalist1:
+            datalist.append(item)
+        saveData1(datalist1, "top250.xls")
+
+    page=1
+    movies=[]
+    #对列表进行分割
+    for i in range(25):
+        movies.append(datalist[i])
+    return render_template('movie.html', movies=movies, page=page)
+
+#进行分页
+@app.route('/movie/start=<int:page>')
+def movie2(page):
+    movies=[]
+    #对列表进行分割
+    if page:    #page存在
+        first=(page-1)*25   #首页
+        last=page*25    #尾页
+    else :
+        first=0   #首页
+        last=25    #尾页
+    for i in range(first,last):
+        movies.append(datalist[i])
+    #列表分割完成
+    if page == 1:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 2:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 3:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 4:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 5:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 6:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 7:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 8:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 9:
+        return render_template('movie.html', movies=movies, page=page)
+    elif page == 10:
+        return render_template('movie.html', movies=movies, page=page)
+    else :
+        return render_template('movie.html', movies=movies, page=page)
+
+@app.route('/score')
+def score():
+    if (movieScore == [] or num == []):
+        # print("关于评分数据库被启动了!")
+        con = sqlite3.connect('data.db')
+        cur = con.cursor()
+        sql = "select score,count(score) from movie250 group by score"
+        data = cur.execute(sql)
+        for item in data:
+            movieScore.append(item[0])
+            num.append(item[1])
+        cur.close()
+        con.close()
+    return render_template('score.html', movieScore=movieScore, num=num)
+
+@app.route('/word')
+def word():
+    return render_template('word.html')
+
+# 上传文件
+@app.route('/upload_file', methods=['POST', 'GET'])
+def upload():
+    if request.method == 'POST':
+        f = request.files['file']
+        f.filename = 'upload.jpg'
+        f.save(f.filename)
+    return render_template('word.html')
+
+@app.route('/separate')
+def separate():
+    return render_template('separate.html')
+
+@app.route('/team')
+def team():
+    return render_template('team.html')
+
+@app.route('/cities')
+def cities():
+    return render_template('cities.html')
+
+@app.route('/citylist')
+def citylist():
+    load_single_dict({ord('重'): 'chong'})
+    datalist1 = []
+    cityname = request.url
+    print("cityname=" + cityname)
+    cityname = "".join(lazy_pinyin(cityname))
+    cityname = cityname[cityname.index('=') + 1:len(cityname)]
+    print("cityname=" + cityname)
+
+    baseurl = "https://movie.douban.com/cinema/nowplaying/" + cityname + '/'
+    dbpath = "data.db"
+
+    con = sqlite3.connect(dbpath)
+    cur = con.cursor()
+    datalist_get = getData2(baseurl)
+    saveData2DB2(datalist_get, dbpath)
+    saveData2(datalist_get,"citylist.xls")
+    sql = "select * from citymovies"
+    data = cur.execute(sql)
+
+    for item in data:
+        datalist1.append(item)
+    cur.close()
+    con.close()
+
+    citymovies=[]
+    #对列表进行分割
+    for i in range(len(datalist1)):
+        citymovies.append(datalist1[i])
+    return render_template('citylist.html', citymovies = citymovies)
+
+@app.route('/citylist.xls')
+def citylist_xls():
+    return send_from_directory("./","citylist.xls")
+
+@app.route('/top250.xls')
+def top250_xls():
+    return send_from_directory("./","top250.xls")
+
+@app.route('/upload.jpg')
+def upldIMG():
+    return send_from_directory("./","upload.jpg")
+
+@app.route('/output.jpg')
+def outJPG():
+    makeWordcloud("upload.jpg")
+    return send_from_directory("./","output.jpg")
+
+@app.route('/updateDBTb1')
+def updateDBTb1():
+    datalist_get = getData1("https://movie.douban.com/top250?start=")
+    saveData1DB1(datalist_get, "data.db")
+    return "数据库更新成功！"
+
+
+
+if __name__ == "__main__":
+    app.run(debug=True)

attention.txt

@@ -0,0 +1 @@
+注意：文件目录下与目录名称相同的压缩包是存放在该目录的文件（别问，问就是懒-.-）

css1.css

@@ -1,151 +0,0 @@
-.topnav {
-    overflow: hidden;
-    background-color: whitesmoke;
-    float: left;
-    width: 100%;
-    text-align: center;
-    font-size: 20px;
-    position: fixed;
-    top:0;
-    box-shadow: 10px 5px 15px dimgray;
-    z-index: 1;
-}
-
-.topnav a{
-    display: inline-block;
-    color: black;
-    text-align: center;
-    padding: 20px 60px;
-    text-decoration: none;
-}
-
-.topnav a:hover{
-    background-color: black;
-}
-
-.topnav a:active{
-    background-color: dimgray;
-}
-
-.header{
-    background: #7ec6bc;  /* fallback for old browsers */
-    background: -webkit-linear-gradient(to right, #ebe717, #7ec6bc);  /* Chrome 10-25, Safari 5.1-6 */
-    background: linear-gradient(to right, #ebe717, #7ec6bc); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
-    width: 100%;
-    color: white;
-    padding: 50px 0px;
-    text-align: center;
-    font-size: 72px;
-}
-
-.topnav a:hover{
-    background-color: black;
-    color: white;
-    top:60px;
-}
-
-#frame{
-    text-align: center;
-}
-
-#frame iframe{
-    width: 100%;
-    height: 1800px;
-    border: 0;
-}
-
-.introduction{
-    text-align: center;
-    width: 100%;
-    height: 500px;
-    padding-top: 80px;
-}
-
-.try{
-    color: white;
-    text-decoration-line: none;
-    position: relative;
-    top:50px;
-    border: none;
-    font-size: 20px;
-    background-color: black;
-    padding: 30px 60px;
-    border-radius: 10px;
-}
-
-.try:hover{
-    background-color: dimgray;
-}
-
-.title{
-    font-size: 72px;
-    position: relative;
-    top:-80px;
-}
-
-.playing{
-    width: 100%;
-    text-align: center;
-}
-
-.lable{
-    position: relative;
-    top:100px;
-    font-size: 48px;
-}
-
-.searching{
-    width: 100%;
-    height: 50px;
-    position: relative;
-    top:100px;
-}
-
-.searching ul{
-    list-style-type: none;
-}
-
-.searching ul li{
-    display: inline-block;
-}
-
-.searching input{
-    width: 800px;
-    height: 80px;
-    font-size: 48px;
-    border-radius: 10px;
-}
-
-.searching input:focus{
-    background-color: black;
-    color: white;
-}
-
-.searching_logo button{
-    text-align: center;
-    border: none;
-    width: 88px;
-    height: 88px;
-    font-size: 48px;
-    position: relative;
-    top: 4px;
-    border-radius: 10px;
-}
-
-.searching_logo button:hover{
-    background-color: black;
-
-}
-
-.about{
-    width: 100%;
-    height: 1080px;
-background-image: url("IMG_0210.JPG")}
-
-.us{
-    position: relative;
-    top: 100px;
-    width: 100%;
-    font-size: 60px;
-    text-align: center;
-}

spider.py

@@ -0,0 +1,303 @@
+from pypinyin import lazy_pinyin,load_single_dict
+from bs4 import BeautifulSoup
+import re
+import urllib.error,urllib.request
+import xlwt
+import json
+import sqlite3
+import threading
+global val
+val = []
+
+
+#对于豆瓣top250电影爬取内容的正则表达式
+findLink = re.compile(r'<a href="(.*?)">')
+findImgSrc = re.compile(r'<img.*src="(.*?)"',re.S)
+findTitle = re.compile(r'<span class="title">(.*)</span>')
+findRating = re.compile(r'<span class="rating_num" property="v:average">(.*)</span>')
+findJudge = re.compile(r'<span>(\d*)人评价</span>')
+findBd = re.compile(r'<p class="">(.*?)</p>',re.S)
+
+
+#对于豆瓣当前某城市正在上映的电影爬取内容的正则表达式
+findnowmovielink = re.compile(r'.*data-psource="poster" href="(.*?)" target="_blank">',re.S)
+findnowmovieimg = re.compile(r'src="(.*?)"/>')
+findnowmovietitle= re.compile(r'data-title="(.*?)"')
+findnowmovieactors= re.compile(r'data-actors="(.*?)"')
+findnowmovietime= re.compile(r'data-duration="(.*?)"')
+findnowmovieregion= re.compile(r'data-region="(.*?)"')
+findnowmoviedirector= re.compile(r'data-director="(.*?)"')
+findnowmovieid = re.compile(r'id="(.*?)"')
+
+
+
+def main():
+    a = input("Enter a number: ")
+    if a=="1":
+        baseurl = "https://movie.douban.com/top250?start="  #指定的网页超链接
+        datalist1 = getData1(baseurl)  #返回一个装有所有数据的列表
+        savepath = ".\\top250.xls"  #存储数据的文档路径
+        saveData1(datalist1,savepath)  #存储数据
+        dbpath = "data.db"
+        saveData1DB1(datalist1,dbpath)
+
+    if a=="2":
+        b = input("Enter a city: ")
+        baseurl = "https://movie.douban.com/cinema/nowplaying/" + b + '/'
+        datalist2 = getData2(baseurl)
+        savepath = ".\\citymovies.xls"
+        saveData2(datalist2,savepath)
+        dbpath = "data.db"
+        saveData2DB2(datalist2, dbpath)
+
+    if a=="3":      #后台更新柱状图的参数
+        updateCitiesData()
+
+def multi_thread(usl1):
+    threads = []
+    for i in range(0,10):
+        threads.append(
+            threading.Thread(target = askURL1,args=(usl1+str(i*25),))
+        )
+    for thread in threads:
+        thread.start()
+    for thread in threads:
+        thread.join()
+    # print(threads)
+    return threads
+
+
+#用于获得数据
+def getData1(baseurl):
+    global val
+    datalist = []  #将获得的数据装于datalist这个列表
+    multi_thread(baseurl)
+    for j in range(0,10):
+        soup = BeautifulSoup(val[j],"html.parser")  #解析
+        for item in soup.find_all('div',class_= "item"):
+            #print(item)  #一个测试点
+            data = []  #将每一部电影的具体信息装入data列表
+            item = str(item)
+            link = re.findall(findLink,item)[0]  #详情链接
+            data.append(link)
+            imgSrc = re.findall(findImgSrc,item)[0]  #图片链接
+            data.append(imgSrc)
+            titles = re.findall(findTitle,item)  #标题
+            if(len(titles) == 2 ):
+                ctitle = titles[0]
+                data.append(ctitle)
+                otitle = titles[1].replace("/","")
+                data.append(otitle)
+            else:
+                data.append(titles[0])
+                data.append(" ")
+            rating = re.findall(findRating,item)[0]  #评分
+            data.append(rating)
+            judgeNum = re.findall(findJudge,item)[0]  #评分人数
+            data.append(judgeNum)
+            bd = re.findall(findBd,item)[0]  #概要
+            bd = re.sub('\s',"",bd)
+            bd = re.sub(r'/',"",bd)
+            bd = re.sub('<br>',"",bd)
+            data.append(bd.strip())
+            datalist.append(data)  #将data列表装入datalist列表
+    print(datalist)
+    return datalist
+
+def getData2(baseurl):
+    datalist = []  #将获得的数据装于datalist这个列表
+    html = askURL2(baseurl)
+    soup = BeautifulSoup(html,"html.parser")  #解析
+    for item in soup.find_all('li',class_= "list-item"): #一个测试点
+            data = []  #将每一部电影的具体信息装入data列表
+            item = str(item)
+            link = re.findall(findnowmovielink,item)[0]
+            data.append(link)
+            img = re.findall(findnowmovieimg,item)[0]
+            data.append(img)
+            title = re.findall(findnowmovietitle,item)[0]
+            data.append(title)
+            director = re.findall(findnowmoviedirector, item)[0]
+            data.append(director)
+            actors = re.findall(findnowmovieactors,item)[0]
+            data.append(actors)
+            time = re.findall(findnowmovietime, item)[0]
+            data.append(time)
+            region = re.findall(findnowmovieregion, item)[0]
+            data.append(region)
+            id = re.findall(findnowmovieid,item)[0]
+            data.append(id)
+            datalist.append(data)  #将data列表装入datalist列表
+    return datalist
+
+#用来得到一个指定URL的网页内容(豆瓣top250)
+def askURL1(url):
+    #伪装为浏览器
+    global val
+    head = {
+        "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/99.0.4844.74 Safari/537.36 Edg/99.0.1150.55"
+    }
+    resquest = urllib.request.Request(url,headers=head)
+    html = ""
+    try:
+        response = urllib.request.urlopen(resquest)
+        html = response.read().decode("utf-8")
+        #print(html)
+    except urllib.error.URLError as e:
+        if hasattr(e,"code"):
+            print(e.code)
+        if hasattr(e,"reason"):
+            print(e.reason)
+    val.append(html)
+    # print(html)
+    # return html
+
+def askURL2(url):
+    # 伪装为浏览器
+    head = {
+        "User-Agent": " Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4896.75 Safari/537.36 Edg/100.0.1185.36"
+    }
+    resquest = urllib.request.Request(url, headers=head)
+    html = ""
+    try:
+        response = urllib.request.urlopen(resquest)
+        html = response.read().decode("utf-8")
+        # print(html)
+    except urllib.error.URLError as e:
+        if hasattr(e, "code"):
+            print(e.code)
+        if hasattr(e, "reason"):
+            print(e.reason)
+    return html
+
+def init_tb1(dbpath):
+    sql = '''
+          create table if not exists movie250     
+          (
+          info_link text,
+          pic_link text,
+          cname varchar ,
+          ename varchar ,
+          score numeric ,
+          rated numeric ,
+          info text
+          )
+    '''
+    conn = sqlite3.connect(dbpath)
+    cursor = conn.cursor()
+
+    cursor.execute(sql)
+    cursor.execute("delete from movie250 where 1=1;")
+    conn.commit()
+    conn.close()
+
+def init_tb2(dbpath):
+    sql = '''
+          create table if not exists citymovies 
+          (
+          link text,
+          img text,
+          title varchar ,
+          director varchar ,
+          actors varchar ,
+          times varchar ,
+          region varchar ,
+          id varchar 
+          )
+    '''
+    conn = sqlite3.connect(dbpath)
+    cursor = conn.cursor()
+    cursor.execute(sql)
+    cursor.execute("delete from citymovies where 1=1;")
+    conn.commit()
+    conn.close()
+
+def saveData1DB1(datalist,dbpath):
+    init_tb1(dbpath)
+    conn = sqlite3.connect(dbpath)
+    cur = conn.cursor()
+    for data in datalist:
+        for index in range(len(data)):
+            if index == 4 or index == 5:
+                continue
+            data[index] = '"'+data[index].strip()+'"'
+        sql = '''
+              insert into movie250(info_link,pic_link,cname,ename,score,rated,info)
+              values(%s)'''%",".join(data)
+
+        cur.execute(sql)
+        conn.commit()
+    cur.close()
+    conn.close()
+
+def saveData2DB2(datalist,dbpath):
+    init_tb2(dbpath)
+    conn = sqlite3.connect(dbpath)
+    cur = conn.cursor()
+    for data in datalist:
+        for index in range(len(data)):
+            data[index] = '"'+data[index].strip()+'"'
+        sql = '''
+              insert into citymovies(link,img,title,director,actors,times,region,id)
+              values(%s)'''%",".join(data)
+
+
+        cur.execute(sql)
+        conn.commit()
+    cur.close()
+    conn.close()
+
+def saveData1(datalist,savepath):
+    print("save...")
+    book = xlwt.Workbook(encoding="utf-8",style_compression=0)
+    sheet = book.add_sheet("豆瓣电影Top250",cell_overwrite_ok=True)
+    col = ("电影详情链接","图片链接","影片中文名字","影片外国名字","评分","评价数","相关信息")
+    for i in range(0,7):
+        sheet.write(0,i,col[i])
+    for i in range(0,250):
+        print("第%d条"%(i+1))
+        data = datalist[i]
+        for j in range(0,7):
+            sheet.write(i,j,data[j])
+    book.save(savepath)
+
+def saveData2(datalist,savepath):
+    print("save...")
+    book = xlwt.Workbook(encoding="utf-8",style_compression=0)
+    sheet = book.add_sheet("豆瓣电影Top250",cell_overwrite_ok=True)
+    col = ("电影详情链接","图片链接","影片中文名字","导演","演员","时长","制片地区","电影id")
+    for i in range(0,8):
+        sheet.write(0,i,col[i])
+    for i in range(len(datalist)):
+        print("第%d条"%(i+1))
+        data = datalist[i]
+        for j in range(0,8):
+            sheet.write(i,j,data[j])
+    book.save(savepath)
+
+def updateCitiesData():      #用于后台更新柱状图的参数
+    f = open("./static/assets/json/citiesData.json", "r" ,encoding = "utf-8")
+    data_dict = (dict(json.load(f)))
+
+    print(data_dict)
+    feature_list = data_dict["features"]
+    load_single_dict({ord('重'): 'chong'})
+    for item in feature_list:
+
+        item["properties"]["名称"] = "".join(lazy_pinyin(item["properties"]["名称"]))
+
+        cityname = item["properties"]["名称"][0:len(item["properties"]["名称"]) - 3]
+
+        print(cityname+':', end=" ")
+
+        item["properties"]["Yuanxian"] = len(getData2("https://movie.douban.com/cinema/nowplaying/" + cityname + '/'))
+        print(item["properties"]["Yuanxian"])
+
+    f.close()
+    f = open("./static/assets/json/citiesData.json", "w", encoding="GBK")
+    json.dump(data_dict,f)
+    f.close()
+
+if __name__ == "__main__":
+    main()
+    print("爬取完成!")

static/assets/js/main.js

@@ -0,0 +1,171 @@
+/**
+* Template Name: Mamba - v2.0.1
+* Template URL: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/
+* Author: BootstrapMade.com
+* License: https://bootstrapmade.com/license/
+*/
+!(function($) {
+  "use strict";
+
+  // Toggle .header-scrolled class to #header when page is scrolled
+  $(window).scroll(function() {
+    if ($(this).scrollTop() > 100) {
+      $('#header').addClass('header-scrolled');
+    } else {
+      $('#header').removeClass('header-scrolled');
+    }
+  });
+
+  if ($(window).scrollTop() > 100) {
+    $('#header').addClass('header-scrolled');
+  }
+
+  // Stick the header at top on scroll
+  $("#header").sticky({
+    topSpacing: 0,
+    zIndex: '50'
+  });
+
+  // Smooth scroll for the navigation menu and links with .scrollto classes
+  $(document).on('click', '.nav-menu a, .mobile-nav a, .scrollto', function(e) {
+    if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
+      e.preventDefault();
+      var target = $(this.hash);
+      if (target.length) {
+
+        var scrollto = target.offset().top;
+        var scrolled = 2;
+
+        if ($('#header-sticky-wrapper').length) {
+          scrollto -= $('#header-sticky-wrapper').outerHeight() - scrolled;
+        }
+
+        if ($(this).attr("href") == '#header') {
+          scrollto = 0;
+        }
+
+        $('html, body').animate({
+          scrollTop: scrollto
+        }, 1500, 'easeInOutExpo');
+
+        if ($(this).parents('.nav-menu, .mobile-nav').length) {
+          $('.nav-menu .active, .mobile-nav .active').removeClass('active');
+          $(this).closest('li').addClass('active');
+        }
+
+        if ($('body').hasClass('mobile-nav-active')) {
+          $('body').removeClass('mobile-nav-active');
+          $('.mobile-nav-toggle i').toggleClass('icofont-navigation-menu icofont-close');
+          $('.mobile-nav-overly').fadeOut();
+        }
+        return false;
+      }
+    }
+  });
+
+  // Mobile Navigation
+  if ($('.nav-menu').length) {
+    var $mobile_nav = $('.nav-menu').clone().prop({
+      class: 'mobile-nav d-lg-none'
+    });
+    $('body').append($mobile_nav);
+    $('body').prepend('<button type="button" class="mobile-nav-toggle d-lg-none"><i class="icofont-navigation-menu"></i></button>');
+    $('body').append('<div class="mobile-nav-overly"></div>');
+
+    $(document).on('click', '.mobile-nav-toggle', function(e) {
+      $('body').toggleClass('mobile-nav-active');
+      $('.mobile-nav-toggle i').toggleClass('icofont-navigation-menu icofont-close');
+      $('.mobile-nav-overly').toggle();
+    });
+
+    $(document).on('click', '.mobile-nav .drop-down > a', function(e) {
+      e.preventDefault();
+      $(this).next().slideToggle(300);
+      $(this).parent().toggleClass('active');
+    });
+
+    $(document).click(function(e) {
+      var container = $(".mobile-nav, .mobile-nav-toggle");
+      if (!container.is(e.target) && container.has(e.target).length === 0) {
+        if ($('body').hasClass('mobile-nav-active')) {
+          $('body').removeClass('mobile-nav-active');
+          $('.mobile-nav-toggle i').toggleClass('icofont-navigation-menu icofont-close');
+          $('.mobile-nav-overly').fadeOut();
+        }
+      }
+    });
+  } else if ($(".mobile-nav, .mobile-nav-toggle").length) {
+    $(".mobile-nav, .mobile-nav-toggle").hide();
+  }
+
+  // Intro carousel
+  var heroCarousel = $("#heroCarousel");
+  var heroCarouselIndicators = $("#hero-carousel-indicators");
+  heroCarousel.find(".carousel-inner").children(".carousel-item").each(function(index) {
+    (index === 0) ?
+    heroCarouselIndicators.append("<li data-target='#heroCarousel' data-slide-to='" + index + "' class='active'></li>"):
+      heroCarouselIndicators.append("<li data-target='#heroCarousel' data-slide-to='" + index + "'></li>");
+  });
+
+  heroCarousel.on('slid.bs.carousel', function(e) {
+    $(this).find('h2').addClass('animated fadeInDown');
+    $(this).find('p').addClass('animated fadeInUp');
+    $(this).find('.btn-get-started').addClass('animated fadeInUp');
+  });
+
+  // Back to top button
+  $(window).scroll(function() {
+    if ($(this).scrollTop() > 100) {
+      $('.back-to-top').fadeIn('slow');
+    } else {
+      $('.back-to-top').fadeOut('slow');
+    }
+  });
+
+  $('.back-to-top').click(function() {
+    $('html, body').animate({
+      scrollTop: 0
+    }, 1500, 'easeInOutExpo');
+    return false;
+  });
+
+  // Initiate the venobox plugin
+  $(window).on('load', function() {
+    $('.venobox').venobox();
+  });
+
+  // jQuery counterUp
+  $('[data-toggle="counter-up"]').counterUp({
+    delay: 10,
+    time: 1000
+  });
+
+  // Porfolio isotope and filter
+  $(window).on('load', function() {
+    var portfolioIsotope = $('.portfolio-container').isotope({
+      itemSelector: '.portfolio-item',
+      layoutMode: 'fitRows'
+    });
+
+    $('#portfolio-flters li').on('click', function() {
+      $("#portfolio-flters li").removeClass('filter-active');
+      $(this).addClass('filter-active');
+
+      portfolioIsotope.isotope({
+        filter: $(this).data('filter')
+      });
+    });
+
+    // Initiate venobox (lightbox feature used in portofilo)
+    $(document).ready(function() {
+      $('.venobox').venobox();
+    });
+  });
+
+  // Initi AOS
+  AOS.init({
+    duration: 1000,
+    easing: "ease-in-out-back"
+  });
+
+})(jQuery);

templates/cities.html

@@ -0,0 +1,353 @@
+<!DOCTYPE html>
+<html lang="en">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<style>
+    .search{
+        position: relative;
+        top:50px;
+        border-radius: 10px;
+        padding: 15px;
+        width: 50%;
+        height: 50px;
+        text-align: left;
+        font-size: 20px;
+        border-width: 1px;
+    }
+
+    .submit{
+        position: relative;
+        top:70px;
+        border-radius: 10px;
+        border-width: 0;
+        height: 50px;
+        width: 150px;
+        font-family: 微软雅黑;
+        color: black;
+        background-color:#b8daff;
+        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 5px 0 rgba(0,0,0,0);
+    }
+
+    .submit:hover{
+        background-color: silver;
+        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+    }
+
+            body {
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            padding: 0;
+        }
+
+        #map {
+            position: relative;
+            text-align: center;
+            top:100px;
+            width: 52%;
+            left: 24%;
+            height: 300px;
+            margin: 0;
+            padding: 0;
+            border-radius: 20px;
+            {#box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,10%);#}
+        }
+
+
+        .demo-title {
+            position: absolute;
+            top: 50px;
+            left: 50px;
+            z-index: 1;
+        }
+
+        h1 {
+            margin: 0;
+            color: black;
+            font-size: 30px;
+        }
+
+        #title{
+            font-size: 32px;
+        }
+
+        #p{
+            color: slategrey;
+        }
+
+        h3 {
+            font-weight: normal;
+            margin-top: 5px;
+            color: #8E939D;
+        }
+
+</style>
+<head>
+  <meta charset="utf-8">
+  <meta content="width=device-width, initial-scale=1.0" name="viewport">
+
+  <title>城市院线信息 </title>
+  <meta content="" name="descriptison">
+  <meta content="" name="keywords">
+
+  <!-- Favicons -->
+  <link href="static/assets/img/favicon.png" rel="icon">
+  <link href="static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
+
+  <!-- Google Fonts -->
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
+
+  <!-- Vendor CSS Files -->
+  <link href="static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
+  <link href="static/assets/vendor/icofont/icofont.min.css" rel="stylesheet" type="text/css">
+  <link href="static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet" type="text/css">
+  <link href="static/assets/vendor/animate.css/animate.min.css" rel="stylesheet" type="text/css">
+  <link href="static/assets/vendor/venobox/venobox.css" rel="stylesheet" type="text/css">
+  <link href="static/assets/vendor/aos/aos.css" rel="stylesheet" type="text/css">
+
+  <!-- Template Main CSS File -->
+  <link href="static/assets/css/style.css" rel="stylesheet" type="text/css">
+
+  <!-- =======================================================
+  * Template Name: Mamba - v2.0.1
+  * Template URL: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/
+  * Author: BootstrapMade.com
+  * License: https://bootstrapmade.com/license/
+  ======================================================== -->
+</head>
+
+<body>
+  <!-- ======= Header ======= -->
+  <header id="header">
+    <div class="container">
+
+      <div class="logo float-left">
+        <h1 class="text-light"><a href="/first"><span>ＣＡＴＣＨ</span></a></h1>
+        <!-- Uncomment below if you prefer to use an image logo -->
+        <!-- <a href="index.html"><img src="static/assets/img/logo.png" alt="" class="img-fluid"></a>-->
+      </div>
+
+      <nav class="nav-menu float-right d-none d-lg-block">
+        <ul>
+          <li><a href="/first">首页</a></li>
+          <li class="active"><a href="/separate">电影</a></li>
+          <li><a href="/score">评分</a></li>
+          <li><a href="/word">词云</a></li>
+          <li><a href="/team">团队</a></li>
+        </ul>
+      </nav><!-- .nav-menu -->
+
+    </div>
+  </header><!-- End Header -->
+
+  <!-- ======= Our Team Section ======= -->
+  <section id="team" class="team">
+                            <div class="section-title" >
+                    <h2 id = "title" style="position: relative;">输入城市拼音以查询院线</h2>
+                    <p id = "p" style="position: relative;">找到你想看的</p>
+                </div>
+            <div class="container" style="padding-bottom: 170px;background-color: aliceblue;position: relative;">
+                <div data-aos="fade-up">
+                    <div>
+                        <form name = "subform" method="post" action="/cities">
+                              <input class = "search" type="text" name="cityname" placeholder="请输入城市名称（支持汉字和完整拼音）"><br>
+                            <input class="submit" name="submit" type="submit" onclick="open_details()">
+                        </form>
+                    </div>
+                    <div id="map">
+                    </div>
+                </div>
+            </div>
+                      <p style="font-size: 20px;z-index: 1;flood-color: black; position: relative;top:-50px" data-aos="fade-up">（院线热力柱图）</p>
+        </div>
+  </section><!-- End Our Team Section -->
+
+
+
+  <!-- ======= Footer ======= -->
+  <footer id="footer">
+    <div class="container">
+      <div class="copyright">
+        @sakula <strong><span>F*35#213</span></strong>Welcome
+      </div>
+      <div class="credits">
+        <!-- All the links in the footer should remain intact. -->
+        <!-- You can delete the links only if you purchased the pro version. -->
+        <!-- Licensing information: https://bootstrapmade.com/license/ -->
+        <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
+      </div>
+    </div>
+  </footer><!-- End Footer -->
+
+  <a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>
+
+  <!-- Vendor JS Files -->
+  <script src="static/assets/vendor/jquery/jquery.min.js"></script>
+  <script src="static/assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+  <script src="static/assets/vendor/jquery.easing/jquery.easing.min.js"></script>
+  <script src="static/assets/vendor/php-email-form/validate.js"></script>
+  <script src="static/assets/vendor/jquery-sticky/jquery.sticky.js"></script>
+  <script src="static/assets/vendor/venobox/venobox.min.js"></script>
+  <script src="static/assets/vendor/waypoints/jquery.waypoints.min.js"></script>
+  <script src="static/assets/vendor/counterup/counterup.min.js"></script>
+  <script src="static/assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
+  <script src="static/assets/vendor/aos/aos.js"></script>
+  <!-- Template Main JS File -->
+  <script src="static/assets/js/main.js"></script>
+
+  <script>
+      function getCityName(){
+          window.location.href = "citylist";
+      }
+
+        window.movingDraw = true;
+    </script>
+    <script
+        src="https://webapi.amap.com/maps?v=2.0&key=baae10ac6ad8448f91db1d420e9afb32&plugin=AMap.Scale,AMap.ToolBar"></script>
+    <script type="text/javascript"
+        src="https://webapi.amap.com/loca?v=2.0.0&key=baae10ac6ad8448f91db1d420e9afb32"></script>
+
+    {#高德API接口#}
+    <script>
+      var map = new AMap.Map('map', {
+          zoom: 5,
+          showLabel: false,
+          viewMode: '3D',
+          pitch: 55,
+          center: [103.594884,36.964587],
+          mapStyle: 'amap://styles/9d89a78e93bd0ee7506030fa35b9de47',
+      });
+
+      var loca = new Loca.Container({
+          map,
+      });
+
+      loca.ambLight = {
+          intensity: 0.7,
+          color: '#7b7bff',
+      };
+      loca.dirLight = {
+          intensity: 0.8,
+          color: '#fff',
+          target: [0, 0, 0],
+          position: [0, -1, 1],
+      };
+      loca.pointLight = {
+          color: 'rgb(240,88,25)',
+          position: [112.028276, 31.58538, 2000000],
+          intensity: 3,
+          // 距离表示从光源到光照强度为 0 的位置，0 就是光不会消失。
+          distance: 5000000,
+      };
+
+      var pl = new Loca.PrismLayer({
+          zIndex: 10,
+          opacity: 1,
+          visible: false,
+          hasSide: true,
+      });
+
+      var geo = new Loca.GeoJSONSource({
+          url: './static/assets/json/citiesData.json',
+      });
+      pl.setSource(geo);
+      // top3 的城市增加文字
+      var topConf = {
+
+      };
+      pl.setStyle({
+          unit: 'meter',
+          sideNumber: 32,
+          topColor: (index, f) => {
+              var n = f.properties['Yuanxian'];
+              return n > 10 ? '#E97091' : '#2852F1';
+          },
+          sideTopColor: (index, f) => {
+              var n = f.properties['Yuanxian'];
+              return n > 10 ? '#E97091' : '#2852F1';
+          },
+          sideBottomColor: '#002bb9',
+          radius: 15000,
+          height: (index, f) => {
+              var props = f.properties;
+              var height = Math.max(100, Math.sqrt(props['Yuanxian']) * 100000 - 350000);
+              var conf = topConf[props['地址']];
+              // top3 的数据，增加文字表达
+              if (conf) {
+                  map.add(
+                      new AMap.Marker({
+                          anchor: 'bottom-center',
+                          position: [f.coordinates[0], f.coordinates[1], height],
+                          content: '<div style="margin-bottom: 10px; float: left; font-size: 14px;height: 57px; width: 180px; color:#fff; background: no-repeat url(' +
+                              conf +
+                              '); background-size: 100%;"><p style="margin: 7px 0 0 35px; height: 20px; line-height:20px;">' +
+                              props['地址'] + '院线 ' + props['Yuanxian'] + '</p>' +
+                              '<p style="margin: 4px 0 0 35px; height: 20px; line-height:20px; color: #00a9ff; font-size: 13px;">' +
+                              props['Yuanxian'] + ' 个' +
+                              '</p></div>',
+                      }),
+                  );
+              }
+              return height;
+              // return 60000 + n * 100;
+          },
+          // rotation: 360 * 100,
+          altitude: 0,
+      });
+      loca.add(pl);
+      map.on('complete', function () {
+          setTimeout(function () {
+              pl.show(500);
+              pl.addAnimate({
+                  key: 'height',
+                  value: [0, 1],
+                  duration: 500,
+                  easing: 'Linear',
+                  transform: 500,
+                  random: true,
+                  delay: 5000,
+              });
+          }, 800);
+      });
+      loca.animate.start();
+
+
+      // 点击事件处理
+      var clickInfo = new AMap.Marker({
+          anchor: 'bottom-center',
+          position: [116.396923, 39.918203, 0],
+      });
+      clickInfo.setMap(map);
+      clickInfo.hide();
+      // 动画测试
+      map.on('click', function (e) {
+          var feat = pl.queryFeature(e.pixel.toArray());
+          if (feat) {
+              clickInfo.show();
+              var props = feat.properties;
+              var height = Math.max(100, Math.sqrt(props['Yuanxian']) * 50000 - 350000);
+              clickInfo.setPosition([feat.coordinates[0], feat.coordinates[1], height]);
+              clickInfo.setContent(
+                  '<div style="text-align: center; height: 20px; width: 150px; color:black; font-size: 14px;">' +
+                  feat.properties['地址'] + ': ' + feat.properties['Yuanxian'] + '个' +
+                  ' </div>'
+              );
+          } else {
+              clickInfo.hide();
+          }
+      });
+
+
+    </script>
+
+    <script>
+        function open_details(){
+            if(document.forms["subform"]["cityname"].value == '')
+                alert("请输入内容！")
+            else
+                window.open("/citylist?cityname=" + document.forms["subform"]["cityname"].value);
+        }
+    </script>
+
+</body>
+
+</html>

templates/citylist.html

@@ -0,0 +1,294 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta content="width=device-width, initial-scale=1.0" name="viewport">
+
+  <title id = "title"></title>
+  <meta content="" name="descriptison">
+  <meta content="" name="keywords">
+  <meta name = "referrer" content="never"> <!--访问豆瓣海报图片所需参数-->
+  <!-- Favicons -->
+  <link href="../static/assets/img/favicon.png" rel="icon">
+
+  <!-- Google Fonts -->
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
+
+  <!-- Vendor CSS Files -->
+  <link href="../static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
+  <link href="../static/assets/vendor/icofont/icofont.min.css" rel="stylesheet" type="text/css">
+  <link href="../static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet" type="text/css">
+  <link href="../static/assets/vendor/animate.css/animate.min.css" rel="stylesheet" type="text/css">
+  <link href="../static/assets/vendor/venobox/venobox.css" rel="stylesheet" type="text/css">
+  <link href="../static/assets/vendor/aos/aos.css" rel="stylesheet" type="text/css">
+
+  <!-- Template Main CSS File -->
+  <link href="../static/assets/css/style.css" rel="stylesheet">
+
+  <!-- =======================================================
+  * Template Name: Mamba - v2.0.1
+  * Template URL: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/
+  * Author: BootstrapMade.com
+  * License: https://bootstrapmade.com/license/
+  ======================================================== -->
+   <style>
+     table tr{
+       display: flex;
+         text-align: center;
+     }
+     table tr td{
+       padding-bottom: 15px;
+       padding-top: 15px;
+       text-align: center;
+     }
+
+    .title{
+      flex: 2;
+      text-align: center;
+    }
+    .eName{
+      flex: 2;
+      text-align: center;
+    }
+    .director{
+      flex: 1;
+      text-align: center;
+    }
+    .actors{
+      flex: 1;
+      text-align: center;
+    }
+    .findinfo{
+      flex: 5;
+      text-align: center;
+    }
+    .movieinfo{
+      flex: 16;
+      text-align: center;
+    }
+    .image{
+      text-align: center;
+      flex: 2;
+    }
+
+    .times{
+      text-align: center;
+      flex: 1;
+    }
+
+    .pic{
+        width: 120px;
+        height: 160px;
+    }
+
+    .region{
+      text-align: center;
+      flex: 2;
+    }
+
+    /* 分页的css */
+    .pagination{
+      width: 100%;
+      margin: 0 auto;
+      margin-top: 30px;
+      margin-left: 100px;
+      text-align: center;
+    }
+    button:not(.download_button){
+      width: 55px;
+      height: 50px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+    }
+
+    .download_button{
+      padding:20px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 0px 5px 0 rgba(0,0,0,10%);
+    }
+
+     .download_button:hover{
+      padding:20px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         background-color: #6aa3d5;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+    }
+
+     .download_button:active{
+      padding:20px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         background-color: silver;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,10%);
+    }
+
+    button:hover:not(.download_button:hover){
+      width: 55px;
+      height: 50px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+        background-color: #6aa3d5;
+    }
+
+    button:active:not(.download_button:active){
+        width: 55px;
+      height: 50px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,50%);
+        background-color: silver;
+    }
+
+    .download_list{
+        list-style-type: none;
+        text-align: right;
+        padding-right: 15px;
+    }
+
+   </style>
+</head>
+
+<body>
+  <!-- ======= Header ======= -->
+  <header id="header">
+    <div class="container">
+
+      <div class="logo float-left">
+        <h1 class="text-light"><a href="/first"><span>ＣＡＴＣＨ</span></a></h1>
+        <!-- Uncomment below if you prefer to use an image logo -->
+        <!-- <a href="index.html"><img src="../static/assets/img/logo.png" alt="" class="img-fluid"></a>-->
+      </div>
+
+      <nav class="nav-menu float-right d-none d-lg-block">
+        <ul>
+          <li><a href="/first">首页</a></li>
+          <li class="active"><a href="/separate">电影</a></li>
+          <li><a href="/score">评分</a></li>
+          <li><a href="/word">词云</a></li>
+          <li><a href="/team">团队</a></li>
+        </ul>
+      </nav><!-- .nav-menu -->
+
+    </div>
+  </header><!-- End Header -->
+
+  <!-- ======= Our Team Section ======= -->
+  <section id="team" class="team">
+    <div class="container">
+      <div class="section-title">
+          <h2><p id = "name"></p>正在热映</h2>
+      </div>
+      <!-- ======= Counts Section ======= -->
+      <section class="counts section-bg">
+        <ul class="download_list">
+            <li>
+                <button class = "download_button" onclick="download()">下载EXCEL</button>
+            </li>
+        </ul>
+        <div class="container">
+          <table class="table table-striped">
+              <tr>
+                  <td class="image">影片海报</td>
+                  <td class="title">影片名称</td>
+                  <td class="director">导演</td>
+                  <td class="actors">演员</td>
+                  <td class="times">电影时长</td>
+                  <td class="region">上映地区</td>
+              </tr>
+            {% for movie in citymovies %}
+              <tr>
+                  <td class = "image">
+                       <img class="pic" src= {{ movie[1] }}>
+                  </td>
+                  <td class="title">
+                      <a href="{{ movie[1] }}" target="_blank">{{ movie[2] }}</a>
+                  </td>
+                  <td class="director">{{ movie[3] }}</td>
+                  <td class="actors">{{ movie[4] }}</td>
+                  <td class="times">{{ movie[5] }}</td>
+              <td class="region">{{ movie[6] }}</td>
+
+              </tr>
+            {% endfor %}
+          </table>
+        </div>
+      </section><!-- End Counts Section -->
+    </div>
+  </section><!-- End Our Team Section -->
+
+  <!-- ======= Footer ======= -->
+  <footer id="footer">
+    <div class="container">
+      <div class="copyright">
+        @sakula <strong><span>F*35#213</span></strong>Welcome
+      </div>
+      <div class="credits">
+        <!-- All the links in the footer should remain intact. -->
+        <!-- You can delete the links only if you purchased the pro version. -->
+        <!-- Licensing information: https://bootstrapmade.com/license/ -->
+        <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
+      </div>
+    </div>
+  </footer><!-- End Footer -->
+
+  <a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>
+
+  <!-- Vendor JS Files -->
+  <script src="../static/assets/vendor/jquery/jquery.min.js"></script>
+  <script src="../static/assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+  <script src="../static/assets/vendor/jquery.easing/jquery.easing.min.js"></script>
+  <script src="../static/assets/vendor/php-email-form/validate.js"></script>
+  <script src="../static/assets/vendor/jquery-sticky/jquery.sticky.js"></script>
+  <script src="../static/assets/vendor/venobox/venobox.min.js"></script>
+  <script src="../static/assets/vendor/waypoints/jquery.waypoints.min.js"></script>
+  <script src="../static/assets/vendor/counterup/counterup.min.js"></script>
+  <script src="../static/assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
+  <script src="../static/assets/vendor/aos/aos.js"></script>
+
+  <!-- Template Main JS File -->
+  <script src="../static/assets/js/main.js"></script>
+  <script>
+    var str = location.href;
+    var start = str.indexOf("=") + 1;
+    var end = str.length;
+    cityname = decodeURI(str.substring(start, end));
+    document.getElementById("name").innerHTML = cityname;
+    document.getElementById("title").innerText = cityname + "正在热映";
+  </script>
+   <script>
+       function download(){
+           window.open("/citylist.xls")
+       }
+   </script>
+</body>
+
+</html>

templates/first.html

@@ -5,27 +5,27 @@
   <meta charset="utf-8">
   <meta content="width=device-width, initial-scale=1.0" name="viewport">
 
-  <title>豆瓣Top250数据分析</title>
+  <title>豆瓣影视数据分析</title>
   <meta content="" name="descriptison">
   <meta content="" name="keywords">
 
   <!-- Favicons -->
-  <link href="static/assets/img/favicon.png" rel="icon">
+  <link href="static/assets/img/favicon.png" rel="icon" type="text/css">
-  <link href="static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
+  <link href="static/assets/img/apple-touch-icon.png" rel="apple-touch-icon" type="text/css">
 
   <!-- Google Fonts -->
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
 
   <!-- Vendor CSS Files -->
-  <link href="static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
-  <link href="static/assets/vendor/icofont/icofont.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/icofont/icofont.min.css" rel="stylesheet" type="text/css">
-  <link href="static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet" type="text/css">
-  <link href="static/assets/vendor/animate.css/animate.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/animate.css/animate.min.css" rel="stylesheet" type="text/css">
-  <link href="static/assets/vendor/venobox/venobox.css" rel="stylesheet">
+  <link href="static/assets/vendor/venobox/venobox.css" rel="stylesheet" type="text/css">
-  <link href="static/assets/vendor/aos/aos.css" rel="stylesheet">
+  <link href="static/assets/vendor/aos/aos.css" rel="stylesheet" type="text/css">
 
   <!-- Template Main CSS File -->
-  <link href="static/assets/css/style.css" rel="stylesheet">
+  <link href="static/assets/css/style.css" rel="stylesheet" type="text/css">
 
   <!-- =======================================================
   * Template Name: Mamba - v2.0.1
@@ -49,7 +49,7 @@
       <nav class="nav-menu float-right d-none d-lg-block">
         <ul>
           <li class="active"><a href="/first">首页</a></li>
-          <li><a href="/movie">电影</a></li>
+          <li><a href="/separate">电影</a></li>
           <li><a href="/score">评分</a></li>
           <li><a href="/word">词云</a></li>
           <li><a href="/team">团队</a></li>
@@ -63,35 +63,35 @@
   <section id="team" class="team">
     <div class="container">
       <div class="section-title">
-        <h2>豆瓣电影Top250</h2>
+        <h2>基于爬虫的豆瓣影视数据分析</h2>
-        <p>看到你想看的</p>
+        <p>找到你想看的</p>
       </div>
       <!-- ======= Counts Section ======= -->
       <section class="counts section-bg">
         <div class="container">
           <div class="row">
 
-            <div class="col-lg-3 col-md-6 text-center" data-aos="fade-up">
+            <div class="col-lg-3 col-md-8 text-center" data-aos="fade-up">
-              <a href="/movie">
+              <a href="/separate">
                 <div class="count-box">
-                    <div class="pic"><img src="static/assets/img/touch/排行榜.png" class="img-fluid" alt=""></div>
+                    <div class="pic"><img src="static/assets/img/touch/movie.png" class="img-fluid" alt=""></div>
 {#                    <i class="icofont-simple-smile" style="color: #20b38e;"></i>#}
-                  <span data-toggle="counter-up">250</span>
+                  <span data-toggle="counter-up">416</span>
-                  <p>高分电影</p>
+                  <p>影视信息</p>
                 </div>
               </a>
             </div>
-            <div class="col-lg-3 col-md-6 text-center" data-aos="fade-up" data-aos-delay="200">
+            <div class="col-lg-3 col-md-8 text-center" data-aos="fade-up" data-aos-delay="50">
               <a href="/score">
                 <div class="count-box">
 {#                  <i class="icofont-document-folder" style="color: #c042ff;"></i>#}
-                    <div class="pic"><img src="static/assets/img/touch/合_00-统计分析.png" class="img-fluid" alt=""></div>
+                    <div class="pic"><img src="static/assets/img/touch/排行榜.png" class="img-fluid" alt=""></div>
-                  <span data-toggle="counter-up">1</span>
+                  <span data-toggle="counter-up">250</span>
                   <p>评分统计</p>
                 </div>
               </a>
             </div>
-            <div class="col-lg-3 col-md-6 text-center" data-aos="fade-up" data-aos-delay="400">
+            <div class="col-lg-3 col-md-8 text-center" data-aos="fade-up" data-aos-delay="100">
               <a href="/word">
                 <div class="count-box">
 {#                  <i class="icofont-live-support" style="color: #46d1ff;"></i>#}
@@ -101,11 +101,11 @@
                 </div>
               </a>
             </div>
-            <div class="col-lg-3 col-md-6 text-center" data-aos="fade-up" data-aos-delay="600">
+            <div class="col-lg-3 col-md-8 text-center" data-aos="fade-up" data-aos-delay="150">
               <a href="/team">
                 <div class="count-box">
 {#                  <i class="icofont-users-alt-5" style="color: #ffb459;"></i>#}
-                    <div class="pic"><img src="static/assets/img/touch/团队.png" class="img-fluid" alt=""></div>
+                    <div class="pic"><img src="static/assets/img/touch/team.png" class="img-fluid" alt=""></div>
                   <span data-toggle="counter-up">6</span>
                   <p>团队成员</p>
                 </div>
@@ -129,7 +129,6 @@
         <!-- You can delete the links only if you purchased the pro version. -->
         <!-- Licensing information: https://bootstrapmade.com/license/ -->
         <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
-        Designed by <a href="https://bootstrapmade.com/">2000300309陈乐</a>
       </div>
     </div>
   </footer><!-- End Footer -->

templates/movie.html

@@ -8,10 +8,9 @@
   <title>豆瓣Top250数据分析</title>
   <meta content="" name="descriptison">
   <meta content="" name="keywords">
-
+  <meta name = "referrer" content="never"> <!--访问豆瓣海报图片所需参数-->
   <!-- Favicons -->
   <link href="../static/assets/img/favicon.png" rel="icon">
-  <link href="../static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
 
   <!-- Google Fonts -->
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
@@ -36,45 +35,136 @@
    <style>
      table tr{
        display: flex;
+         text-align: center;
      }
      table tr td{
-       height: 100px;
+       padding-bottom: 15px;
+       padding-top: 15px;
+       text-align: center;
      }
+
      .id{
         flex: 1;
+        text-align: center;
     }
     .cName{
       flex: 2;
+      text-align: center;
     }
     .eName{
       flex: 2;
+      text-align: center;
     }
     .score{
       flex: 1;
+      text-align: center;
     }
     .evaluation{
       flex: 1;
+      text-align: center;
     }
     .findinfo{
-      flex: 5;
-    }
-    .movieinfo{
       flex: 6;
+      text-align: center;
+    }
+
+    .img{
+      text-align: center;
+      flex: 4;
+    }
+    .pic{
+        width: 120px;
+        height: 160px;
     }
     /* 分页的css */
     .pagination{
       width: 100%;
       margin: 0 auto;
       margin-top: 30px;
-      margin-left: 250px;
+      margin-left: 100px;
+      text-align: center;
+    }
+    button:not(.download_button){
+      width: 55px;
+      height: 50px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+    }
+
+    .download_button{
+      padding:20px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 0px 5px 0 rgba(0,0,0,10%);
+    }
+
+     .download_button:hover{
+      padding:20px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         background-color: #6aa3d5;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+    }
+
+     .download_button:active{
+      padding:20px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+         background-color: silver;
+         box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,10%);
     }
-    button{
+
+    button:hover:not(.download_button:hover){
       width: 55px;
       height: 50px;
       font-size: 13px;
       font-family: 微软雅黑;
       margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,10%);
+        background-color: #6aa3d5;
     }
+
+
+
+    button:active:not(.download_button:active){
+        width: 55px;
+      height: 50px;
+      font-size: 13px;
+      font-family: 微软雅黑;
+      margin: 5px;
+      text-align: center;
+        border-radius: 10px;
+        border-width: 0px;
+        box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,50%);
+        background-color: silver;
+    }
+
+    .download_list{
+        list-style-type: none;
+        text-align: right;
+        padding-right: 15px;
+    }
+
    </style>
 </head>
 
@@ -92,7 +182,7 @@
       <nav class="nav-menu float-right d-none d-lg-block">
         <ul>
           <li><a href="/first">首页</a></li>
-          <li class="active"><a href="/movie">电影</a></li>
+          <li class="active"><a href="/separate">电影</a></li>
           <li><a href="/score">评分</a></li>
           <li><a href="/word">词云</a></li>
           <li><a href="/team">团队</a></li>
@@ -110,30 +200,34 @@
       </div>
       <!-- ======= Counts Section ======= -->
       <section class="counts section-bg">
+        <ul class="download_list">
+            <li>
+                <button class = "download_button" onclick="download()">下载EXCEL</button>
+                <button class = "download_button" onclick="updateDBTb1()">更新数据库</button>
+            </li>
+        </ul>
         <div class="container">
           <table class="table table-striped">
               <tr>
-                  <td class="id">排名</td>
+                  <td class="img">影片海报</td>
                   <td class="cName">影片中文名</td>
                   <td class="eName">影片外国名</td>
                   <td class="score">影片评分</td>
                   <td class="evaluation">评价人数</td>
                   <td class="findinfo">概述</td>
-                  <td class="movieinfo">影片的相关内容</td>
               </tr>
             {% for movie in movies %}
               <tr>
-                  <td class="id">{{ movie[0] }}</td>
+                  <td class = "img">
+                       <img class="pic" src= {{ movie[1] }}>
+                  </td>
                   <td class="cName">
-                    <a href="{{ movie[1] }}" target="_blank">
+                      <a href="{{ movie[0] }}" target="_blank">{{ movie[2] }}</a>
-                      {{ movie[3] }}
-                    </a>
                   </td>
-                  <td class="eName">{{ movie[4] }}</td>
+                  <td class="eName">{{ movie[3] }}</td>
-                  <td class="score">{{ movie[5] }}</td>
+                  <td class="score">{{ movie[4] }}</td>
-                  <td class="evaluation">{{ movie[6] }}</td>
+                  <td class="evaluation">{{ movie[5] }}</td>
-                  <td class="findinfo">{{ movie[7] }}</td>
+                  <td class="findinfo">{{ movie[6] }}</td>
-                  <td class="movieinfo">{{ movie[8] }}</td>
               </tr>
             {% endfor %}
           </table>
@@ -160,7 +254,7 @@
               {% if page == 10 %}
               <button class="nextpage" onclick="javascript:alert('已经是最后一页！！！')">下一页</button>
               {% else %}
-              <button class="nextpage" onclick="window.location.href='/movie/start={{ page+1 }}'">下一页</button>
+              <button class="nextpage" onclick="window.location.href='/movie/start={{ page + 1 }}'">下一页</button>
               {% endif %}
           </div>
         </div>
@@ -179,7 +273,6 @@
         <!-- You can delete the links only if you purchased the pro version. -->
         <!-- Licensing information: https://bootstrapmade.com/license/ -->
         <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
-        Designed by <a href="https://bootstrapmade.com/">2000300309陈乐</a>
       </div>
     </div>
   </footer><!-- End Footer -->
@@ -200,7 +293,17 @@
 
   <!-- Template Main JS File -->
   <script src="../static/assets/js/main.js"></script>
-
+  <script>
+      function updateDBTb1(){
+          alert("数据库更新时间较长，请耐心等待弹出网页的加载！")
+          window.open("/updateDBTb1")
+      }
+  </script>
+   <script>
+       function download(){
+           window.open("/top250.xls")
+       }
+   </script>
 </body>
 
 </html>

templates/score.html

@@ -11,7 +11,6 @@
   <script src="../static/assets/js/echarts.min.js"></script>
   <!-- Favicons -->
   <link href="../static/assets/img/favicon.png" rel="icon">
-  <link href="../static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
 
   <!-- Google Fonts -->
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
@@ -92,7 +91,7 @@
       <nav class="nav-menu float-right d-none d-lg-block">
         <ul>
           <li><a href="/first">首页</a></li>
-          <li><a href="/movie">电影</a></li>
+          <li><a href="/separate">电影</a></li>
           <li class="active"><a href="/score">评分</a></li>
           <li><a href="/word">词云</a></li>
           <li><a href="/team">团队</a></li>
@@ -113,7 +112,7 @@
         <div class="container">
             <!-- 放置图表 -->
             <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
-            <div id="main" style="width: 100%;height:400px;"></div>
+            <div id="main" style="width: 100%;height:500px;"></div>
             <script type="text/javascript">
                 // 基于准备好的dom，初始化echarts实例
                 var myChart = echarts.init(document.getElementById('main'));

templates/separate.html

@@ -0,0 +1,136 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta content="width=device-width, initial-scale=1.0" name="viewport">
+
+  <title>选择浏览方式</title>
+  <meta content="" name="descriptison">
+  <meta content="" name="keywords">
+
+  <!-- Favicons -->
+  <link href="static/assets/img/favicon.png" rel="icon">
+  <link href="static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
+
+  <!-- Google Fonts -->
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
+
+  <!-- Vendor CSS Files -->
+  <link href="static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/icofont/icofont.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/animate.css/animate.min.css" rel="stylesheet">
+  <link href="static/assets/vendor/venobox/venobox.css" rel="stylesheet">
+  <link href="static/assets/vendor/aos/aos.css" rel="stylesheet">
+
+  <!-- Template Main CSS File -->
+  <link href="static/assets/css/style.css" rel="stylesheet">
+
+  <!-- =======================================================
+  * Template Name: Mamba - v2.0.1
+  * Template URL: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/
+  * Author: BootstrapMade.com
+  * License: https://bootstrapmade.com/license/
+  ======================================================== -->
+</head>
+
+<body>
+  <!-- ======= Header ======= -->
+  <header id="header">
+    <div class="container">
+
+      <div class="logo float-left">
+        <h1 class="text-light"><a href="/first"><span>ＣＡＴＣＨ</span></a></h1>
+        <!-- Uncomment below if you prefer to use an image logo -->
+        <!-- <a href="index.html"><img src="static/assets/img/logo.png" alt="" class="img-fluid"></a>-->
+      </div>
+
+      <nav class="nav-menu float-right d-none d-lg-block">
+        <ul>
+          <li><a href="/first">首页</a></li>
+          <li class="active"><a href="/separate">电影</a></li>
+          <li><a href="/score">评分</a></li>
+          <li><a href="/word">词云</a></li>
+          <li><a href="/team">团队</a></li>
+        </ul>
+      </nav><!-- .nav-menu -->
+
+    </div>
+  </header><!-- End Header -->
+
+  <!-- ======= Our Team Section ======= -->
+  <section id="team" class="team">
+    <div class="container">
+      <div class="section-title">
+        <h2>选择一种查询方式</h2>
+        <p>找到你想看的</p>
+      </div>
+      <!-- ======= Counts Section ======= -->
+      <section class="counts section-bg">
+        <div class="container">
+          <div class="row">
+             <div class="col-lg-3 col-md-3 text-center"></div>
+            <div class="col-lg-3 col-md-3 text-center" data-aos="fade-up">
+              <a href="/movie">
+                <div class="count-box">
+                    <div class="pic"><img src="static/assets/img/touch/奖杯2-1.png" class="img-fluid" alt=""></div>
+{#                    <i class="icofont-simple-smile" style="color: #20b38e;"></i>#}
+                  <span>250</span>
+                  <p>高分电影</p>
+                </div>
+              </a>
+            </div>
+
+            <div class="col-lg-3 col-md-3 text-center align-content-center" data-aos="fade-up" data-aos-delay="50">
+              <a href="/cities">
+                <div class="count-box">
+{#                  <i class="icofont-users-alt-5" style="color: #ffb459;"></i>#}
+                    <div class="pic"><img src="static/assets/img/touch/cities.png" class="img-fluid" alt=""></div>
+                        <span data-toggle="counter-up">416</span>
+                        <p>上映城市</p>
+                </div>
+              </a>
+            </div>
+            <div class="col-lg-3 col-md-3 text-center"></div>
+          </div>
+        </div>
+      </section><!-- End Counts Section -->
+    </div>
+  </section><!-- End Our Team Section -->
+
+  <!-- ======= Footer ======= -->
+  <footer id="footer">
+    <div class="container">
+      <div class="copyright">
+        @sakula <strong><span>F*35#213</span></strong>Welcome
+      </div>
+      <div class="credits">
+        <!-- All the links in the footer should remain intact. -->
+        <!-- You can delete the links only if you purchased the pro version. -->
+        <!-- Licensing information: https://bootstrapmade.com/license/ -->
+        <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
+      </div>
+    </div>
+  </footer><!-- End Footer -->
+
+  <a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>
+
+  <!-- Vendor JS Files -->
+  <script src="static/assets/vendor/jquery/jquery.min.js"></script>
+  <script src="static/assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+  <script src="static/assets/vendor/jquery.easing/jquery.easing.min.js"></script>
+  <script src="static/assets/vendor/php-email-form/validate.js"></script>
+  <script src="static/assets/vendor/jquery-sticky/jquery.sticky.js"></script>
+  <script src="static/assets/vendor/venobox/venobox.min.js"></script>
+  <script src="static/assets/vendor/waypoints/jquery.waypoints.min.js"></script>
+  <script src="static/assets/vendor/counterup/counterup.min.js"></script>
+  <script src="static/assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
+  <script src="static/assets/vendor/aos/aos.js"></script>
+
+  <!-- Template Main JS File -->
+  <script src="static/assets/js/main.js"></script>
+
+</body>
+
+</html>

templates/team.html

@@ -5,7 +5,7 @@
   <meta charset="utf-8">
   <meta content="width=device-width, initial-scale=1.0" name="viewport">
 
-  <title>豆瓣Top250数据分析</title>
+  <title>团队信息</title>
   <meta content="" name="descriptison">
   <meta content="" name="keywords">
 
@@ -49,7 +49,7 @@
       <nav class="nav-menu float-right d-none d-lg-block">
         <ul>
           <li><a href="/first">首页</a></li>
-          <li><a href="/movie">电影</a></li>
+          <li><a href="/separate">电影</a></li>
           <li><a href="/score">评分</a></li>
           <li><a href="/word">词云</a></li>
           <li class="active"><a href="/team">团队</a></li>
@@ -64,17 +64,17 @@
 
       <div class="section-title">
         <h2>小组</h2>
-        <p>这是李宇涛和他的分身</p>
+        <p>成员名单及分工</p>
       </div>
 
-      <div class="row">
+      <div class="row" style="position: relative; top:50px;bottom: 500px">
 
-        <div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up">
+        <div class="col-xl-2 col-lg-2 col-md-2" data-aos="fade-up">
           <div class="member">
-            <div class="pic"><img src="static/assets/img/team/p5.jpg" class="img-fluid" alt=""></div>
+            <div class="pic"><img class="img-fluid" alt=""></div>
             <div class="member-info">
-              <h4>爬虫</h4>
+              <h4>爬虫功能实现</h4>
-              <span>负责爬虫代码</span>
+              <span>2000300320李宇涛</span>
               <div class="social">
                 <a href=""><i class="icofont-web"></i></a>
                 <a href=""><i class="icofont-twitter"></i></a>
@@ -85,12 +85,12 @@
           </div>
         </div>
 
-        <div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="50">
+        <div class="col-xl-2 col-lg-2 col-md-2" data-aos="fade-up" data-aos-delay="50">
           <div class="member">
-            <div class="pic"><img src="static/assets/img/team/p2.jpg" class="img-fluid" alt=""></div>
+            <div class="pic"><img class="img-fluid" alt=""></div>
             <div class="member-info">
               <h4>数据</h4>
-              <span>负责数据可视化和UI设计</span>
+              <span>2000300319李霄鹏</span>
               <div class="social">
                 <a href=""><i class="icofont-web"></i></a>
                 <a href=""><i class="icofont-twitter"></i></a>
@@ -101,12 +101,12 @@
           </div>
         </div>
 
-        <div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="100">
+        <div class="col-xl-2 col-lg-2 col-md-2" data-aos="fade-up" data-aos-delay="100">
           <div class="member">
-            <div class="pic"><img src="static/assets/img/team/p3.jpg" class="img-fluid" alt=""></div>
+            <div class="pic"><img class="img-fluid" alt=""></div>
             <div class="member-info">
               <h4>前端</h4>
-              <span>负责网页构建</span>
+              <span>2000300322刘健乐</span>
               <div class="social">
                 <a href=""><i class="icofont-web"></i></a>
                 <a href=""><i class="icofont-twitter"></i></a>
@@ -117,12 +117,12 @@
           </div>
         </div>
 
-        <div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="150">
+        <div class="col-xl-2 col-lg-2 col-md-2" data-aos="fade-up" data-aos-delay="150">
           <div class="member">
-            <div class="pic"><img src="static/assets/img/team/p4.jpg" class="img-fluid" alt=""></div>
+            <div class="pic"><img class="img-fluid" alt=""></div>
             <div class="member-info">
               <h4>框架</h4>
-              <span>负责简化代码</span>
+              <span>2000300309陈乐</span>
               <div class="social">
                 <a href=""><i class="icofont-web"></i></a>
                 <a href=""><i class="icofont-twitter"></i></a>
@@ -137,12 +137,12 @@
 
 
 
-         <div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="200">
+         <div class="col-xl-2 col-lg-2 col-md-2" data-aos="fade-up" data-aos-delay="200">
           <div class="member">
-            <div class="pic"><img src="static/assets/img/team/p4.jpg" class="img-fluid" alt=""></div>
+            <div class="pic"><img class="img-fluid" alt=""></div>
             <div class="member-info">
-              <h4>分析</h4>
+              <h4>优化</h4>
-              <span>负责报告书写</span>
+              <span>2000300318李松泽</span>
               <div class="social">
                 <a href=""><i class="icofont-web"></i></a>
                 <a href=""><i class="icofont-twitter"></i></a>
@@ -155,12 +155,12 @@
 
 
 
-          <div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="200">
+          <div class="col-xl-2 col-lg-2 col-md-2" data-aos="fade-up" data-aos-delay="200">
           <div class="member">
-            <div class="pic"><img src="static/assets/img/team/p4.jpg" class="img-fluid" alt=""></div>
+            <div class="pic"><img class="img-fluid" alt=""></div>
             <div class="member-info">
-              <h4>展示</h4>
+              <h4>资料撰写</h4>
-              <span>负责PPT制作</span>
+              <span>2000300317李秋延</span>
               <div class="social">
                 <a href=""><i class="icofont-web"></i></a>
                 <a href=""><i class="icofont-twitter"></i></a>
@@ -188,7 +188,6 @@
         <!-- You can delete the links only if you purchased the pro version. -->
         <!-- Licensing information: https://bootstrapmade.com/license/ -->
         <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
-        Designed by <a href="https://bootstrapmade.com/">2000300309陈乐</a>
       </div>
     </div>
   </footer><!-- End Footer -->

templates/word.html

@@ -5,13 +5,12 @@
   <meta charset="utf-8">
   <meta content="width=device-width, initial-scale=1.0" name="viewport">
 
-  <title>豆瓣Top250数据分析</title>
+  <title>捕获词云</title>
   <meta content="" name="descriptison">
   <meta content="" name="keywords">
   <script src="../static/assets/js/echarts.min.js"></script>
   <!-- Favicons -->
   <link href="../static/assets/img/favicon.png" rel="icon">
-  <link href="../static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
 
   <!-- Google Fonts -->
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900" rel="stylesheet">
@@ -40,27 +39,7 @@
      table tr td{
        height: 100px;
      }
-     .id{
+
-        flex: 1;
-    }
-    .cName{
-      flex: 2;
-    }
-    .eName{
-      flex: 2;
-    }
-    .score{
-      flex: 1;
-    }
-    .evaluation{
-      flex: 1;
-    }
-    .findinfo{
-      flex: 2;
-    }
-    .movieinfo{
-      flex: 6;
-    }
     /* 分页的css */
     .pagination{
       width: 100%;
@@ -75,6 +54,18 @@
       font-family: 微软雅黑;
       margin: 5px;
     }
+    .title{
+        padding-top: 5px;
+    }
+    .description{
+        font-size: 15px;
+
+    }
+    .up_down_words{
+        text-align: center;
+        font-size: 32px;
+        font-family: 微软雅黑;
+    }
    </style>
 </head>
 
@@ -92,7 +83,7 @@
       <nav class="nav-menu float-right d-none d-lg-block">
         <ul>
           <li><a href="/first">首页</a></li>
-          <li><a href="/movie">电影</a></li>
+          <li><a href="/separate">电影</a></li>
           <li><a href="/score">评分</a></li>
           <li class="active"><a href="/word">词云</a></li>
           <li><a href="/team">团队</a></li>
@@ -109,35 +100,36 @@
       <section class="counts section-bg">
         <div class="container">
             <div class="section-title">
-                <h2>发现每一个感动你的故事</h2>
+                <h2>创造词云，发现每一个感动你的故事</h2>
             </div>
             <!-- ======= About Us Section ======= -->
             <section id="about" class="about">
                 <div class="container">
                     
-                <div class="row no-gutters">
+                <div class="row no-gutters" data-aos="fade-up" data-aos-delay="100">
-                    <div class="col-lg-6 video-box">
+                    <div class="col-lg-6 col-md-6 video-box">
-                    <img src="../static/assets/img/wordtimes.jpg" class="img-fluid" alt="">
+                    <img  src = "/upload.jpg" id = "oripic" style="height: 530px;width: 400px" alt="" >
                     </div>
         
-                    <div class="col-lg-6 d-flex flex-column justify-content-center about-content">
+                    <div class="col-lg-6 col-md-6 d-flex flex-column justify-content-center about-content">
         
                     <div class="section-title">
                         <h2>词频统计</h2>
-                        <p>将最常见，最动人的词汇提取出来</p>
+                        <p style="text-align: center">提取最频繁出现且最动人的词汇</p>
                     </div>
         
-                    <div class="icon-box" data-aos="fade-up" data-aos-delay="100">
+                    <div class="up_down_words" data-aos="fade-up" data-aos-delay="100">
-                        <div class="icon"><i class="bx bx-face"></i></div>
+                        <img src="../static/assets/img/云上传.png" style="width: 60px">
-                        <h4 class="title"><a href="">At Least I Had You--Gentle Bones 林俊杰</a></h4>
+                        <input type="file" name = "loadfile" id = "file" accept="image/*" style="opacity: 100%;opacity:0;position: relative;top:-55px;left: -10px;">
-                        <p class="description">When I'm old and I'm gray.Will this be how its all stays</p>
+                        <p class="description" style="position: relative; font-size: 20px;top:-30px">上传你想要的图片模板<br>（建议使用高对比度图片）</p>
                     </div>
-        
+
-                    <div class="icon-box" data-aos="fade-up" data-aos-delay="100">
+                    <div class="up_down_words" data-aos="fade-up" data-aos-delay="100">
-                        <div class="icon"><i class="bx bx-ghost"></i></div>
+                      <img src="../static/assets/img/下载-文件下载-11.png" style="width: 60px;">
-                        <h4 class="title"><a href="">够钟--周柏豪</a></h4>
+                        <h4 class="title"><a href="/output.jpg">下载词云图片</a></h4>
-                        <p class="description">够钟死心了，当你沉默得高调，为何尚要骚扰，过几多通宵</p>
+                        <p class="description">作为壁纸或其他用途</p>
                     </div>
+
         
                     </div>
                 </div>
@@ -160,7 +152,6 @@
         <!-- You can delete the links only if you purchased the pro version. -->
         <!-- Licensing information: https://bootstrapmade.com/license/ -->
         <!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/ -->
-        Designed by <a href="https://bootstrapmade.com/">2000300309陈乐</a>
       </div>
     </div>
   </footer><!-- End Footer -->
@@ -178,11 +169,32 @@
   <script src="../static/assets/vendor/counterup/counterup.min.js"></script>
   <script src="../static/assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
   <script src="../static/assets/vendor/aos/aos.js"></script>
-  
-
   <!-- Template Main JS File -->
   <script src="../static/assets/js/main.js"></script>
-
+  <script>
+        $('#file').change(function (e) {
+             var files = e.target.files;
+             var formFile = new FormData();
+             formFile.append("file", files[0]); //加入文件对象
+              $.ajax({
+                  url: "/upload_file",
+                  data: formFile,
+                  type: "post",
+                  dataType: "json",
+                  cache: false,//上传文件无需缓存
+                  processData: false,//用于对data参数进行序列化处理 这里必须false
+                  contentType: false //必须
+              })
+            document.getElementById("oripic").src = "/upload.jpg";
+            location.reload()
+        })
+  </script>
+
+     <script>
+       function download(){
+           window.open("/output.jpg")
+       }
+   </script>
 </body>
 
 </html>

web

@@ -1,79 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="utf-8">
-    <title>主页</title>
-</head>
-
-    <link rel="stylesheet" type="text/css" href="css1.css">/*连接CSS*/
-
-    <body>
-        <div class="topnav">
-            <a href="#">主页</a>
-            <a href="#playing">正在热映</a>
-            <a href="#">即将上映</a>
-            <a href="#">TOP榜</a>
-            <a href="#download">下载</a>
-            <a href="#about">关于我们</a>
-        </div>
-
-        <div class="header" id = "header">
-            <p>Python爬虫研究站</p>
-        </div>
-
-        <div class="introduction">
-            <div class = "title">
-                <p>
-                    在这里，可以爬取有关最近影视的相关信息。
-                </p>
-            </div>
-
-            <div>
-                <a class = "try" href = "#playing">尝试一下</a>
-            </div>
-
-        </div>
-
-        <div class = "playing" id = "playing">
-            <div>
-                <p class="lable">
-                    键入以搜索你想要的电影：
-                </p>
-            </div>
-            <div class = "searching" id = "searching">
-                <ul>
-                    <li>
-                        <input type="text" id = "name" name = "name">
-                    </li>
-                    <li class="searching_logo">
-                        <button>🔍</button>
-                    </li>
-                </ul>
-
-            </div>
-        </div>
-
-        <div id = "frame">
-            <iframe></iframe>
-        </div>
-
-
-
-            <div class = "showing">
-
-            </div>
-
-        </div>
-
-        <div class="download" id = "download">
-
-        </div>
-
-        <div class = "about" id = "about">
-            <div>
-                <p class = "us">关于我们</p>
-            </div>
-        </div>
-    </body>
-
-</html>

word.py

@@ -0,0 +1,39 @@
+import jieba
+from matplotlib import pyplot as plt
+from wordcloud import WordCloud
+from PIL import Image
+import numpy as np
+import sqlite3
+
+def makeWordcloud(image_name):
+    con = sqlite3.connect('data.db')
+    cur = con.cursor()
+    sql = 'select info from movie250 '
+    data = cur.execute(sql)
+    text = ""
+    for item in data:
+        text = text + item[0]
+    cur.close()
+    con.close()
+    cut = jieba.cut(text)
+    string = ' '.join(cut)
+    img = Image.open(image_name)
+    img_array = np.array(img)
+    wc = WordCloud(
+        # background_color = 'white',
+        # mask = img_array,
+        # font_path = 'simsun.ttc'
+        font_path="msyhbd.ttc",
+        mask=img_array,
+        width=1500,
+        height=1000,
+        background_color="white",
+        min_font_size=5,
+        max_font_size=120,
+        max_words=600
+    )
+    wc.generate_from_text(string)
+    fig = plt.figure(1)
+    plt.imshow(wc)
+    plt.axis('off')
+    plt.savefig('output.jpg', dpi=1600)