-
python爬虫及其可视化
一、思路分析
本文采用比特币网站作为爬取目标（https://www.ibtctrade.com/），从中获取prices、CNY、市值等，然后导出所得到的数据到excel、sqlite数据中。使用pyarm中的flask框架搭建可视化平台，使用sqlite数据库的数据制作简单的网页，并制作折线图、柱状图、散点图等等。
二、数据爬取
1.引入库
代码如下：
代码如下：
2.解析网页
代码如下：
3.数据保存到excel
代码如下：
path = "比特币简易数据.xls"
dbpath = "比特币.db"
# askurl(baseURL)
def savedata(datalist,path):
print('正在saving·······')
book = xlwt.Workbook(encoding='utf-8',style_compression=0)
sheet = book.add_sheet('比特币数据',cell_overwrite_ok=True)
col = ('简称','全称','最新价格','24H涨跌幅','24H成交额','市值')
for i in range(0,6):
sheet.write(0,i,col[i])
for i in range(0,700):
data = datalist[i]
for j in range(0,6):
sheet.write(i+1,j,data[j])
book.save(path)
4.数据保存到sqlite数据库
代码如下：
app.py
提示：这里对文章进行总结：
在app.py中对sqlite数据库的数据进行提取处理，主要把参数，传给所需要的数据，来制作图表，每个html的代码过多，不在贴出，可根据index.html自行修改.
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width : 700px ;height:800px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
title: {
text: ‘比特币价格饼图’,
subtext: ‘前15位’,
left: ‘center’
},
tooltip: {
trigger: ‘item’,
formatter: ‘{a}
{b} : {c} ({d}%)’
},
legend: {
orient: ‘vertical’,
left: ‘left’,
data: [{{ num[0]|tojson }}, {{ num[1]|tojson }},{{ num[2]|tojson }},{{ num[3]|tojson }}, {{ num[4]|tojson }},{{ num[5]|tojson }},{{ num[6]|tojson }},{{ num[7]|tojson }},{{ num[8]|tojson }},{{ num[9]|tojson }},
{{ num[10]|tojson }},{{ num[11]|tojson }},{{ num[12]|tojson }},{{ num[13]|tojson }},{{ num[14]|tojson }}]
},
series: [
{
name: ‘访问来源’,
type: ‘pie’,
radius: ‘55%’,
center: [‘50%’, ‘60%’],
data: [
{value: {{ sum[0]|tojson }}, name: {{ num[0]|tojson }}},
{value: {{ sum[1]|tojson }}, name: {{ num[1]|tojson }}},
{value: {{ sum[2]|tojson }}, name: {{ num[2]|tojson }}},
{value: {{ sum[3]|tojson }}, name: {{ num[3]|tojson }}},
{value: {{ sum[4]|tojson }}, name: {{ num[4]|tojson }}},
{value: {{ sum[5]|tojson }}, name: {{ num[5]|tojson }}},
{value: {{ sum[6]|tojson }}, name: {{ num[6]|tojson }}},
{value: {{ sum[7]|tojson }}, name: {{ num[7]|tojson }}},
{value: {{ sum[8]|tojson }}, name: {{ num[8]|tojson }}},
{value: {{ sum[9]|tojson }}, name: {{ num[9]|tojson }}},
{value: {{ sum[10]|tojson }}, name: {{ num[10]|tojson }}},
{value: {{ sum[11]|tojson }}, name: {{ num[11]|tojson }}},
{value: {{ sum[12]|tojson }}, name: {{ num[12]|tojson }}},
{value: {{ sum[13]|tojson }}, name: {{ num[13]|tojson }}},
{value: {{ sum[14]|tojson }}, name: {{ num[14]|tojson }}}
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
};
if (option && typeof option === “object”) {
myChart.setOption(option, true);
}
</div>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
sandian.html
<div class="container">
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width : 1000px ;height:800px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = null;
var data = [[1,{{ sum[0]|tojson }},{{ yum[0]|tojson }},{{ num[0]|tojson }}],
[2,{{ sum[1]|tojson }},{{ yum[1]|tojson }},{{ num[1]|tojson }}],
[3,{{ sum[2]|tojson }},{{ yum[2]|tojson }},{{ num[2]|tojson }}],
[4,{{ sum[3]|tojson }},{{ yum[3]|tojson }},{{ num[3]|tojson }}],
[5,{{ sum[4]|tojson }},{{ yum[4]|tojson }},{{ num[4]|tojson }}],
[6,{{ sum[5]|tojson }},{{ yum[5]|tojson }},{{ num[5]|tojson }}],
[7,{{ sum[6]|tojson }},{{ yum[6]|tojson }},{{ num[6]|tojson }}],
[8,{{ sum[7]|tojson }},{{ yum[7]|tojson }},{{ num[7]|tojson }}],
[9,{{ sum[8]|tojson }},{{ yum[8]|tojson }},{{ num[8]|tojson }}],
[10,{{ sum[9]|tojson }},{{ yum[9]|tojson }},{{ num[9]|tojson }}],
[11,{{ sum[10]|tojson }},{{ yum[10]|tojson }},{{ num[10]|tojson }}],
[12,{{ sum[11]|tojson }},{{ yum[11]|tojson }},{{ num[11]|tojson }}],
[13,{{ sum[12]|tojson }},{{ yum[12]|tojson }},{{ num[12]|tojson }}],
[14,{{ sum[13]|tojson }},{{ yum[13]|tojson }},{{ num[13]|tojson }}],
[15,{{ sum[14]|tojson }},{{ yum[14]|tojson }},{{ num[14]|tojson }}],
[16,{{ sum[15]|tojson }},{{ yum[15]|tojson }},{{ num[15]|tojson }}],
[17,{{ sum[16]|tojson }},{{ yum[16]|tojson }},{{ num[16]|tojson }}],
[18,{{ sum[17]|tojson }},{{ yum[17]|tojson }},{{ num[17]|tojson }}],
[19,{{ sum[18]|tojson }},{{ yum[18]|tojson }},{{ num[18]|tojson }}],
[20,{{ sum[19]|tojson }},{{ yum[19]|tojson }},{{ num[19]|tojson }}],
[21,{{ sum[20]|tojson }},{{ yum[20]|tojson }},{{ num[20]|tojson }}],
[22,{{ sum[21]|tojson }},{{ yum[21]|tojson }},{{ num[21]|tojson }}],
[23,{{ sum[22]|tojson }},{{ yum[22]|tojson }},{{ num[22]|tojson }}],
[24,{{ sum[23]|tojson }},{{ yum[23]|tojson }},{{ num[23]|tojson }}],
[25,{{ sum[24]|tojson }},{{ yum[24]|tojson }},{{ num[24]|tojson }}],
[26,{{ sum[25]|tojson }},{{ yum[25]|tojson }},{{ num[25]|tojson }}],
[27,{{ sum[26]|tojson }},{{ yum[26]|tojson }},{{ num[26]|tojson }}],
[28,{{ sum[27]|tojson }},{{ yum[27]|tojson }},{{ num[27]|tojson }}],
[29,{{ sum[28]|tojson }},{{ yum[28]|tojson }},{{ num[28]|tojson }}],
[30,{{ sum[29]|tojson }},{{ yum[29]|tojson }},{{ num[29]|tojson }}]
],
1
option = {
backgroundColor: new echarts.graphic.RadialGradient(0.3, 0.3, 0.8, [{
offset: 0,
color: ‘#f7f8fa’
}, {
offset: 1,
color: ‘#cdd0d5’
}]),
title: {
text: ‘排名前五十市值与涨跌幅关系’
},
legend: {
right: 10,
data: [‘1’, ‘2’]
},
xAxis: {
itemStyle: {
normal: {
label: {
show: true,
positiong: ‘top’,
formatter: ‘{c}%’
}
}
},
splitLine: {
lineStyle: {
type: ‘dashed’
}
}
},
yAxis: {
axisLabel: {
formatter: ‘{value} %’
},
splitLine: {
lineStyle: {
type: ‘dashed’
}
},
scale: true
},
series: [{
name: '-',
data: data,
type: 'scatter',
symbolSize: function (data) {
return Math.sqrt(data[2]) ;
},
emphasis: {
label: {
show: true,
formatter: function (param) {
return param.data[3];
},
position: 'top'
}
},
itemStyle: {
shadowBlur: 10,
shadowColor: 'rgba(120, 36, 50, 0.5)',
shadowOffsetY: 5,
color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
offset: 0,
color: 'rgb(251, 118, 123)'
}, {
offset: 1,
color: 'rgb(204, 46, 72)'
}])
}
}]
}
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</div>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
shuju.html
<section class="counts section-bg">
<div class="container">
<table class="table table_striped">
<tr>
<td>排名</td>
<td>简称</td>
<td>全称</td>
<td>当前价格</td>
<td>24小时涨跌幅</td>
<td>交易额</td>
<td>市值</td>
</tr>
{% for movie in movies %}
<tr>
<td>{{ movie[0] }}</td>
<td>
{{ movie[1] }}
</td>
<td>{{ movie[2] }}</td>
<td>{{ movie[3] }}</td>
<td>
{{ movie[4] }}
</td>
<td>{{ movie[5] }}</td>
<td>{{ movie[6] }}</td>
</tr>
{% endfor %}
</table>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
shuliang.html
<div class="container">
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width : 1000px ;height:800px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = {
color: [‘#3398DB’],
tooltip: {
trigger: ‘axis’,
axisPointer: { // 坐标轴指示器，坐标轴触发有效
type: ‘shadow’ // 默认为直线，可选为：‘line’ | ‘shadow’
}
},
grid: {
left: ‘3%’,
right: ‘4%’,
bottom: ‘3%’,
containLabel: true
},
xAxis: [
{
type: ‘category’,
data: [‘500亿-1000亿’, ‘100亿-500亿’, ‘1亿-100亿’, ‘1000万-9999万’, ‘100万-1000万’,‘10万-100万’,‘1万-10万’],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: ‘value’
}
],
series: [
{
name: ‘数据’,
type: ‘bar’,
barWidth: ‘60%’,
data: [{{ q }}, {{ w }}, {{ e }}, {{ y }}, {{ r }}, {{ u }}, {{ t }},]
}
]
};
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</div>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
zhangdie.html
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width: 1000px ;height:750px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
tooltip: {
trigger: ‘axis’,
position: function (pt) {
return [pt[0], ‘10%’];
}
},
title: {
left: ‘center’,
text: ‘排名前七十比特币市值涨跌图’,
},
toolbox: {
feature: {
dataZoom: {
yAxisIndex: ‘none’
},
restore: {},
saveAsImage: {}
}
},
xAxis: {
type: ‘category’,
boundaryGap: false,
data: {{ num|tojson }}
},
yAxis: {
axisLabel: {
formatter: ‘{value} %’
},
type: ‘value’,
boundaryGap: [0, ‘100%’]
},
dataZoom: [{
type: ‘inside’,
start: 0,
end: 10
}, {
start: 0,
end: 10,
handleIcon: ‘M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z’,
handleSize: ‘80%’,
handleStyle: {
color: ‘#fff’,
shadowBlur: 3,
shadowColor: ‘rgba(0, 0, 0, 0.6)’,
shadowOffsetX: 2,
shadowOffsetY: 2
}
}],
series: [
{
name: ‘数据’,
type: ‘line’,
smooth: true,
symbol: ‘none’,
sampling: ‘average’,
itemStyle: {
color: ‘rgb(255, 70, 131)’
},
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: ‘rgb(255, 158, 68)’
}, {
offset: 1,
color: ‘rgb(255, 70, 131)’
}])
},
data: {{ sum|tojson }}
}
]
};
;
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</div>
wordcloud.html
<div class="row no-gutters">
<div class="col-lg-6 video-box">
<img src="static/assets/234.jpg" class="img-fluid" alt="">
</div>
<div class="col-lg-6 d-flex flex-column justify-content-center about-content">
<div class="section-title">
<h2>词云</h2>
<p>采用比特币的名称来制作图云，当中network， 币，比特，coin，chain等词出现的频率很高，说明了比特币的命名与本身所包含的意义相关</p>
</div>
<div class="icon-box" data-aos="fade-up" data-aos-delay="100">
<div class="icon"><i class="bx bx-fingerprint"></i></div>
<h4 class="title"><a href="">Lorem Ipsum</a></h4>
<p class="description">222</p>
</div>
</div>
</div>
</div>
</section><!-- End About Us Section -->
————————————————
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/www100000/article/details/111721293
本文采用比特币网站作为爬取目标（https://www.ibtctrade.com/），从中获取prices、CNY、市值等，然后导出所得到的数据到excel、sqlite数据中。使用pyarm中的flask框架搭建可视化平台，使用sqlite数据库的数据制作简单的网页，并制作折线图、柱状图、散点图等等。
二、数据爬取
1.引入库
代码如下：
from bs4 import BeautifulSoup
import re
import urllib.error,urllib.request
import xlwt
import sqlite3
2.获取目标网页import re
import urllib.error,urllib.request
import xlwt
import sqlite3
代码如下：
baseURL = 'https://www.ibtctrade.com/cryptocurrency/p_' #比特币交易网的数据一共有27页，分别在此网址上加上后缀，即可实现每个网页的获取
head = {'user-agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36'
}
request = urllib.request.Request(url,headers=head)
html = ""
response = urllib.request.urlopen(request)
html = response.read().decode('utf-8')
# print(html)
return html
该处使用的url网络请求的数据。head = {'user-agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36'
}
request = urllib.request.Request(url,headers=head)
html = ""
response = urllib.request.urlopen(request)
html = response.read().decode('utf-8')
# print(html)
return html
2.解析网页
代码如下：
findjname = re.compile(r'<strong data-v-2dd1dc90="">(.*?)</strong>')
findname = re.compile(r'<span data-v-2dd1dc90="">(.*?)</span>')
findnewprice = re.compile(r'<li data-v-2dd1dc90="">\n(.*?)</li>',re.S)
findtwofourzhangdie = re.compile(r'<li class=".*" data-v-2dd1dc90="">(.*?)</li>',re.S)
# findtwofourdie = re.compile(r'<li class="down" data-v-2dd1dc90="">(.*?)</li>',re.S)
findcny = re.compile(r'<li data-v-2dd1dc90="">\n(.*?)</li>',re.S)
findshizhi = re.compile(r'<li data-v-2dd1dc90="">\n(.*?)</li>',re.S)
def getdata(baseURL):
datalist = []
for i in range(1,28):
url = baseURL + str(i)+'.html'
html = askurl(url)
soup = BeautifulSoup(html,'html.parser')
for item in soup.select('.content>a'):
data =[]
# print(item)
item = str(item)
jname = re.findall(findjname,item)[0]
data.append(jname)
name = re.findall(findname,item)[0]
data.append(name)
# print(data)
newprice = re.findall(findnewprice,item)[0]
data.append(newprice.strip())
twofourzhangdie = re.findall(findtwofourzhangdie,item)[0]
data.append(twofourzhangdie.strip())
cny = re.findall(findcny,item)[1]
data.append(cny.strip())
shizhi = re.findall(findshizhi,item)[2]
data.append(shizhi.strip())
datalist.append(data)
# print(datalist)
return datalist
# print(html)
return html
使用正则表达式进行数据的筛选和清洗findname = re.compile(r'<span data-v-2dd1dc90="">(.*?)</span>')
findnewprice = re.compile(r'<li data-v-2dd1dc90="">\n(.*?)</li>',re.S)
findtwofourzhangdie = re.compile(r'<li class=".*" data-v-2dd1dc90="">(.*?)</li>',re.S)
# findtwofourdie = re.compile(r'<li class="down" data-v-2dd1dc90="">(.*?)</li>',re.S)
findcny = re.compile(r'<li data-v-2dd1dc90="">\n(.*?)</li>',re.S)
findshizhi = re.compile(r'<li data-v-2dd1dc90="">\n(.*?)</li>',re.S)
def getdata(baseURL):
datalist = []
for i in range(1,28):
url = baseURL + str(i)+'.html'
html = askurl(url)
soup = BeautifulSoup(html,'html.parser')
for item in soup.select('.content>a'):
data =[]
# print(item)
item = str(item)
jname = re.findall(findjname,item)[0]
data.append(jname)
name = re.findall(findname,item)[0]
data.append(name)
# print(data)
newprice = re.findall(findnewprice,item)[0]
data.append(newprice.strip())
twofourzhangdie = re.findall(findtwofourzhangdie,item)[0]
data.append(twofourzhangdie.strip())
cny = re.findall(findcny,item)[1]
data.append(cny.strip())
shizhi = re.findall(findshizhi,item)[2]
data.append(shizhi.strip())
datalist.append(data)
# print(datalist)
return datalist
# print(html)
return html
3.数据保存到excel
代码如下：
path = "比特币简易数据.xls"
dbpath = "比特币.db"
# askurl(baseURL)
def savedata(datalist,path):
print('正在saving·······')
book = xlwt.Workbook(encoding='utf-8',style_compression=0)
sheet = book.add_sheet('比特币数据',cell_overwrite_ok=True)
col = ('简称','全称','最新价格','24H涨跌幅','24H成交额','市值')
for i in range(0,6):
sheet.write(0,i,col[i])
for i in range(0,700):
data = datalist[i]
for j in range(0,6):
sheet.write(i+1,j,data[j])
book.save(path)
代码如下：
path = "比特币简易数据.xls"
dbpath = "比特币.db"
# askurl(baseURL)
ef savedb(datalist,dbpath):
init_db(dbpath)
conn = sqlite3.connect(dbpath)
cur = conn.cursor()
for data in datalist:
for i in range(len(data)):
data[i] = '"' +data[i]+'"'
sql = """
insert into bitebi750
(jname, name,newprice,twofourzhangdie,cny,shizhi)
values(%s)"""%','.join(data)
cur.execute(sql)
conn.commit()
cur.close()
conn.close()
def init_db(dbpath):
sql = '''
create table bitebi750
(id integer primary key autoincrement,
jname text,
name text,
newprice text,
twofourzhangdie text,
cny text,
shizhi text)
'''
conn =sqlite3.connect(dbpath)
cursor =conn.cursor()
cursor.execute(sql)
conn.commit()
conn.close()
三、基于flask框架的可视化dbpath = "比特币.db"
# askurl(baseURL)
ef savedb(datalist,dbpath):
init_db(dbpath)
conn = sqlite3.connect(dbpath)
cur = conn.cursor()
for data in datalist:
for i in range(len(data)):
data[i] = '"' +data[i]+'"'
sql = """
insert into bitebi750
(jname, name,newprice,twofourzhangdie,cny,shizhi)
values(%s)"""%','.join(data)
cur.execute(sql)
conn.commit()
cur.close()
conn.close()
def init_db(dbpath):
sql = '''
create table bitebi750
(id integer primary key autoincrement,
jname text,
name text,
newprice text,
twofourzhangdie text,
cny text,
shizhi text)
'''
conn =sqlite3.connect(dbpath)
cursor =conn.cursor()
cursor.execute(sql)
conn.commit()
conn.close()
app.py
提示：这里对文章进行总结：
在app.py中对sqlite数据库的数据进行提取处理，主要把参数，传给所需要的数据，来制作图表，每个html的代码过多，不在贴出，可根据index.html自行修改.
from flask import Flask,render_template
import sqlite3
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/shuju')
def e():
datalist = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select*from bitebi750"
data = cur.execute(sql)
for item in data:
datalist.append(item)
cur.close()
con.close()
return render_template('shuju.html',movies = datalist)
@app.route('/zhangdie')
def zhangdie():
num = []
sum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,twofourzhangdie from bitebi750 limit 0,70"
data = cur.execute(sql)
for item in data:
num.append(str(item[0]))
sum.append(float(item[1][:-1]))
cur.close()
con.close()
return render_template("zhangdie.html",num = num ,sum = sum)
@app.route('/wordcloud')
def wordcloud():
return render_template('wordcloud.html')
@app.route('/qujian')
def qujian():
num = []
sum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,newprice from bitebi750 limit 0,15"
data = cur.execute(sql)
for item in data:
num.append(str(item[0]))
sum.append(float(item[1][1:]))
cur.close()
con.close()
return render_template('qujian.html',num = num ,sum = sum)
@app.route('/sandian')
def sandian():
num = []
sum = []
yum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,twofourzhangdie,shizhi from bitebi750 limit 0,50"
data = cur.execute(sql)
for item in data:
num.append(str(item[0]))
sum.append(float(item[1][:-1]))
yum.append(float(item[2][1:-1]))
cur.close()
con.close()
return render_template('sandian.html',num = num ,sum = sum ,yum =yum)
@app.route('/shuliang')
def shuliang():
q = 0
w = 0
e = 0
r = 0
t = 0
y = 0
u = 0
sum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,shizhi from bitebi750 limit 0,204"
data = cur.execute(sql)
for item in data:
sum.append(float(item[1][1:-1]))
for i in sum:
if i>500 and i<1000:
q += 1
elif i>100 and i<500:
w+=1
elif i>1 and i<100:
e+=1
sql = "select jname,shizhi from bitebi750 limit 204,700"
data = cur.execute(sql)
for item in data:
sum.append(float(item[1][1:-1]))
for i in sum:
if i>100 and i<=1000:
r+=1
elif i>1000 and i<9999:
y+=1
elif i > 1 and i < 10:
t+=1
elif i > 10 and i < 100:
u+=1
cur.close()
con.close()
return render_template("shuliang.html",q=q,w=w,e=e,r=r,t=t,y=y,u=u)
if __name__ == '__main__':
app.run()
index.html
<div class="logo float-left">
<h1 class="text-light"><a href="index.html"><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 class="active"><a href="#header">Home</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#team">团队成员</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav><!-- .nav-menu -->
</div>
<ol class="carousel-indicators" id="hero-carousel-indicators"></ol>
<div class="carousel-inner" role="listbox">
<!-- Slide 1 -->
<div class="carousel-item active" style="background-image: url('static/assets/img/slide/3.jpg');">
<div class="carousel-container">
<div class="carousel-content container">
<h2 class="animated fadeInDown">关于<span>比特币</span></h2>
<p class="animated fadeInUp">比特币（Bitcoin）的概念最初由中本聪在2008年11月1日提出，并于2009年1月3日正式诞生。根据中本聪的思路设计发布的开源软件以及建构其上的P2P网络。比特币是一种P2P形式的虚拟的加密数字货币。点对点的传输意味着一个去中心化的支付系统。</p>
<a href="https://baike.baidu.com/item/%E6%AF%94%E7%89%B9%E5%B8%81/4143690?fr=aladdin" class="btn-get-started animated fadeInUp scrollto">点击了解更多</a>
</div>
</div>
</div>
<!-- Slide 2 -->
<div class="carousel-item" style="background-image: url('static/assets/img/slide/slide-2.jpg');">
<div class="carousel-container">
<div class="carousel-content container">
<h2 class="animated fadeInDown">比特币交易网</h2>
<p class="animated fadeInUp">比特币交易网App实时跟踪比特币交易动态，比特币相关行业资讯，交易行情，支持比特币交易信息发布，并开通分析专栏提供权威的比特币行情解析，汇集和总结业界观点，为比特币交易提供专业的、权威的、具有参考价值的比特币交易平台。
</p>
<a href="https://www.ibtctrade.com/" class="btn-get-started animated fadeInUp scrollto">Read More</a>
</div>
</div>
</div>
<!-- Slide 3 -->
<div class="carousel-item" style="background-image: url('static/assets/img/slide/1.jpg');">
<div class="carousel-container">
<div class="carousel-content container">
<h2 class="animated fadeInDown">比特币风险评估</h2>
<p class="animated fadeInUp">自2009年比特币诞生以来,因其特有的流通方式与价格波动规律,迅速受到资本家与金融投资者的关注与追捧.比特币的实质是当代网络信息技术与密码学的结合,颠覆了人们对货币流通方式的认知观念.本文以传统货币的货币职能对比特币进行讨论,同时对比特币在流通当中所暴露出的风险进行分析..</p>
<a href="https://xueshu.baidu.com/usercenter/paper/show?paperid=100q0p70du0s0e107v6g08a0h4317190&site=xueshu_se" class="btn-get-started animated fadeInUp scrollto">Read More</a>
</div>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#heroCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon icofont-rounded-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#heroCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon icofont-rounded-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<!-- ======= About Us Section ======= -->
<!-- End About Us Section -->
<!-- ======= About Lists Section ======= -->
<!-- ======= Counts Section ======= -->
<!-- ======= Services Section ======= -->
<section id="services" class="services">
<div class="container">
<div class="section-title">
<h2>Services</h2>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up">
<div class="icon"><a href="/shuju"><i class="icofont-computer"></a></i></div>
<h4 class="title"><a href="/shuju">数据总览</a></h4>
<p class="description">共整合了741条数据供分析</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="100">
<div class="icon"><a href="/zhangdie"><i class="icofont-chart-bar-graph"></a></i></div>
<h4 class="title"><a href="">各币种涨跌幅情况</a></h4>
<p class="description">跟着政策走，永远不回头</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="200">
<div class="icon"><a href="/shuliang"><i class="icofont-earth"></a></i></div>
<h4 class="title"><a href="">市值区间币种数量</a></h4>
<p class="description">肯定还是正太分布了</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="300">
<div class="icon"><a href="/qujian"><i class="icofont-image"></i></a></div>
<h4 class="title"><a href="">最具竞争力的币种</a></h4>
<p class="description">看看那个最厉害</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="400">
<div class="icon"><a href="/sandian"><i class="icofont-settings"></i></a></div>
<h4 class="title"><a href="">热门币种市值与涨跌幅关系</a></h4>
<p class="description">只要热门肯定就会涨的啦</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="500">
<div class="icon"><a href="/wordcloud"><i class="icofont-tasks-alt"></a></i></div>
<h4 class="title"><a href="/wordcloud">币名词云</a></h4>
<p class="description">猜猜那个词是最大的</p>
</div>
</div>
</div>
</section><!-- End Services Section -->
<!-- ======= Our Portfolio Section ======= -->
<section id="portfolio" class="portfolio section-bg">
<div class="container" data-aos="fade-up" data-aos-delay="100">
<div class="section-title">
<h2>Our Portfolio</h2>
<p>Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>
</div>
<div class="row">
<div class="col-lg-12">
<ul id="portfolio-flters">
<li data-filter="*" class="filter-active">All</li>
<li data-filter=".filter-app">App</li>
<li data-filter=".filter-card">Card</li>
<li data-filter=".filter-web">Web</li>
</ul>
</div>
</div>
<div class="row portfolio-container">
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/1.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>App 1</h4>
<p>App</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/1.jpg" data-gall="portfolioGallery" class="venobox" title="App 1"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/2.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Web 3</h4>
<p>Web</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/2.jpg" data-gall="portfolioGallery" class="venobox" title="Web 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/3.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>App 2</h4>
<p>App</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/3.jpg" data-gall="portfolioGallery" class="venobox" title="App 2"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/4.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Card 2</h4>
<p>Card</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/4.jpg" data-gall="portfolioGallery" class="venobox" title="Card 2"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/5.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Web 2</h4>
<p>Web</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/5.jpg" data-gall="portfolioGallery" class="venobox" title="Web 2"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/6.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>App 3</h4>
<p>App</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/6.jpg" data-gall="portfolioGallery" class="venobox" title="App 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/7.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Card 1</h4>
<p>Card</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/7.jpg" data-gall="portfolioGallery" class="venobox" title="Card 1"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/8.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Card 3</h4>
<p>Card</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/8.jpg" data-gall="portfolioGallery" class="venobox" title="Card 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/9.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Web 3</h4>
<p>Web</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/9.jpg" data-gall="portfolioGallery" class="venobox" title="Web 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Our Portfolio Section -->
<!-- ======= Our Team Section ======= -->
<section id="team" class="team">
<div class="container">
<div class="section-title">
<h2>Our Team</h2>
<p>Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem.</p>
</div>
<div class="row">
<div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="200">
<div class="member">
<div class="pic"><img src="static/assets/img/team/team-3.jpg" class="img-fluid" alt=""></div>
<div class="member-info">
<h4>xiangbo zhu</h4>
<span>队长</span>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="300">
<div class="member">
<div class="pic"><img src="static/assets/img/team/team-4.jpg" class="img-fluid" alt=""></div>
<div class="member-info">
<h4>Amanda Jepson</h4>
<span>贴身妹子</span>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Our Team Section -->
<!-- ======= Frequently Asked Questions Section ======= -->
<!-- ======= Contact Us Section ======= -->
<section id="contact" class="contact">
<div class="container">
<div class="section-title">
<h2>Contact Us</h2>
</div>
<div class="row">
<div class="col-lg-6 d-flex align-items-stretch" data-aos="fade-up">
<div class="info-box">
<i class="bx bx-map"></i>
<h3>Address</h3>
<p>江大长山校区文理大楼数据分析实验室</p>
</div>
</div>
<div class="col-lg-3 d-flex align-items-stretch" data-aos="fade-up" data-aos-delay="100">
<div class="info-box">
<i class="bx bx-envelope"></i>
<h3>Email Us</h3>
<p>869676614.com<br>10086.com</p>
</div>
</div>
<div class="col-lg-3 d-flex align-items-stretch" data-aos="fade-up" data-aos-delay="200">
<div class="info-box ">
<i class="bx bx-phone-call"></i>
<h3>Call Us</h3>
<p>17836925032<br>17851006312</p>
</div>
</div>
</div>
</section><!-- End Contact Us Section -->
<div class="container">
</div>
<div class="copyright">
© Copyright <strong><span>Mamba</span></strong>. All Rights Reserved
</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/ -->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
qujian.html
其余部分不再显示，只显示主要部分import sqlite3
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/shuju')
def e():
datalist = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select*from bitebi750"
data = cur.execute(sql)
for item in data:
datalist.append(item)
cur.close()
con.close()
return render_template('shuju.html',movies = datalist)
@app.route('/zhangdie')
def zhangdie():
num = []
sum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,twofourzhangdie from bitebi750 limit 0,70"
data = cur.execute(sql)
for item in data:
num.append(str(item[0]))
sum.append(float(item[1][:-1]))
cur.close()
con.close()
return render_template("zhangdie.html",num = num ,sum = sum)
@app.route('/wordcloud')
def wordcloud():
return render_template('wordcloud.html')
@app.route('/qujian')
def qujian():
num = []
sum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,newprice from bitebi750 limit 0,15"
data = cur.execute(sql)
for item in data:
num.append(str(item[0]))
sum.append(float(item[1][1:]))
cur.close()
con.close()
return render_template('qujian.html',num = num ,sum = sum)
@app.route('/sandian')
def sandian():
num = []
sum = []
yum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,twofourzhangdie,shizhi from bitebi750 limit 0,50"
data = cur.execute(sql)
for item in data:
num.append(str(item[0]))
sum.append(float(item[1][:-1]))
yum.append(float(item[2][1:-1]))
cur.close()
con.close()
return render_template('sandian.html',num = num ,sum = sum ,yum =yum)
@app.route('/shuliang')
def shuliang():
q = 0
w = 0
e = 0
r = 0
t = 0
y = 0
u = 0
sum = []
con = sqlite3.connect("比特币.db")
cur = con.cursor()
sql = "select jname,shizhi from bitebi750 limit 0,204"
data = cur.execute(sql)
for item in data:
sum.append(float(item[1][1:-1]))
for i in sum:
if i>500 and i<1000:
q += 1
elif i>100 and i<500:
w+=1
elif i>1 and i<100:
e+=1
sql = "select jname,shizhi from bitebi750 limit 204,700"
data = cur.execute(sql)
for item in data:
sum.append(float(item[1][1:-1]))
for i in sum:
if i>100 and i<=1000:
r+=1
elif i>1000 and i<9999:
y+=1
elif i > 1 and i < 10:
t+=1
elif i > 10 and i < 100:
u+=1
cur.close()
con.close()
return render_template("shuliang.html",q=q,w=w,e=e,r=r,t=t,y=y,u=u)
if __name__ == '__main__':
app.run()
index.html
<div class="logo float-left">
<h1 class="text-light"><a href="index.html"><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 class="active"><a href="#header">Home</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#team">团队成员</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav><!-- .nav-menu -->
</div>
<ol class="carousel-indicators" id="hero-carousel-indicators"></ol>
<div class="carousel-inner" role="listbox">
<!-- Slide 1 -->
<div class="carousel-item active" style="background-image: url('static/assets/img/slide/3.jpg');">
<div class="carousel-container">
<div class="carousel-content container">
<h2 class="animated fadeInDown">关于<span>比特币</span></h2>
<p class="animated fadeInUp">比特币（Bitcoin）的概念最初由中本聪在2008年11月1日提出，并于2009年1月3日正式诞生。根据中本聪的思路设计发布的开源软件以及建构其上的P2P网络。比特币是一种P2P形式的虚拟的加密数字货币。点对点的传输意味着一个去中心化的支付系统。</p>
<a href="https://baike.baidu.com/item/%E6%AF%94%E7%89%B9%E5%B8%81/4143690?fr=aladdin" class="btn-get-started animated fadeInUp scrollto">点击了解更多</a>
</div>
</div>
</div>
<!-- Slide 2 -->
<div class="carousel-item" style="background-image: url('static/assets/img/slide/slide-2.jpg');">
<div class="carousel-container">
<div class="carousel-content container">
<h2 class="animated fadeInDown">比特币交易网</h2>
<p class="animated fadeInUp">比特币交易网App实时跟踪比特币交易动态，比特币相关行业资讯，交易行情，支持比特币交易信息发布，并开通分析专栏提供权威的比特币行情解析，汇集和总结业界观点，为比特币交易提供专业的、权威的、具有参考价值的比特币交易平台。
</p>
<a href="https://www.ibtctrade.com/" class="btn-get-started animated fadeInUp scrollto">Read More</a>
</div>
</div>
</div>
<!-- Slide 3 -->
<div class="carousel-item" style="background-image: url('static/assets/img/slide/1.jpg');">
<div class="carousel-container">
<div class="carousel-content container">
<h2 class="animated fadeInDown">比特币风险评估</h2>
<p class="animated fadeInUp">自2009年比特币诞生以来,因其特有的流通方式与价格波动规律,迅速受到资本家与金融投资者的关注与追捧.比特币的实质是当代网络信息技术与密码学的结合,颠覆了人们对货币流通方式的认知观念.本文以传统货币的货币职能对比特币进行讨论,同时对比特币在流通当中所暴露出的风险进行分析..</p>
<a href="https://xueshu.baidu.com/usercenter/paper/show?paperid=100q0p70du0s0e107v6g08a0h4317190&site=xueshu_se" class="btn-get-started animated fadeInUp scrollto">Read More</a>
</div>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#heroCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon icofont-rounded-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#heroCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon icofont-rounded-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<!-- ======= About Us Section ======= -->
<!-- End About Us Section -->
<!-- ======= About Lists Section ======= -->
<!-- ======= Counts Section ======= -->
<!-- ======= Services Section ======= -->
<section id="services" class="services">
<div class="container">
<div class="section-title">
<h2>Services</h2>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up">
<div class="icon"><a href="/shuju"><i class="icofont-computer"></a></i></div>
<h4 class="title"><a href="/shuju">数据总览</a></h4>
<p class="description">共整合了741条数据供分析</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="100">
<div class="icon"><a href="/zhangdie"><i class="icofont-chart-bar-graph"></a></i></div>
<h4 class="title"><a href="">各币种涨跌幅情况</a></h4>
<p class="description">跟着政策走，永远不回头</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="200">
<div class="icon"><a href="/shuliang"><i class="icofont-earth"></a></i></div>
<h4 class="title"><a href="">市值区间币种数量</a></h4>
<p class="description">肯定还是正太分布了</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="300">
<div class="icon"><a href="/qujian"><i class="icofont-image"></i></a></div>
<h4 class="title"><a href="">最具竞争力的币种</a></h4>
<p class="description">看看那个最厉害</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="400">
<div class="icon"><a href="/sandian"><i class="icofont-settings"></i></a></div>
<h4 class="title"><a href="">热门币种市值与涨跌幅关系</a></h4>
<p class="description">只要热门肯定就会涨的啦</p>
</div>
<div class="col-lg-4 col-md-6 icon-box" data-aos="fade-up" data-aos-delay="500">
<div class="icon"><a href="/wordcloud"><i class="icofont-tasks-alt"></a></i></div>
<h4 class="title"><a href="/wordcloud">币名词云</a></h4>
<p class="description">猜猜那个词是最大的</p>
</div>
</div>
</div>
</section><!-- End Services Section -->
<!-- ======= Our Portfolio Section ======= -->
<section id="portfolio" class="portfolio section-bg">
<div class="container" data-aos="fade-up" data-aos-delay="100">
<div class="section-title">
<h2>Our Portfolio</h2>
<p>Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>
</div>
<div class="row">
<div class="col-lg-12">
<ul id="portfolio-flters">
<li data-filter="*" class="filter-active">All</li>
<li data-filter=".filter-app">App</li>
<li data-filter=".filter-card">Card</li>
<li data-filter=".filter-web">Web</li>
</ul>
</div>
</div>
<div class="row portfolio-container">
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/1.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>App 1</h4>
<p>App</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/1.jpg" data-gall="portfolioGallery" class="venobox" title="App 1"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/2.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Web 3</h4>
<p>Web</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/2.jpg" data-gall="portfolioGallery" class="venobox" title="Web 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/3.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>App 2</h4>
<p>App</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/3.jpg" data-gall="portfolioGallery" class="venobox" title="App 2"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/4.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Card 2</h4>
<p>Card</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/4.jpg" data-gall="portfolioGallery" class="venobox" title="Card 2"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/5.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Web 2</h4>
<p>Web</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/5.jpg" data-gall="portfolioGallery" class="venobox" title="Web 2"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/6.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>App 3</h4>
<p>App</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/6.jpg" data-gall="portfolioGallery" class="venobox" title="App 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/7.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Card 1</h4>
<p>Card</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/7.jpg" data-gall="portfolioGallery" class="venobox" title="Card 1"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/8.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Card 3</h4>
<p>Card</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/8.jpg" data-gall="portfolioGallery" class="venobox" title="Card 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="static/assets/img/portfolio/9.jpg" class="img-fluid" alt="">
<div class="portfolio-info">
<h4>Web 3</h4>
<p>Web</p>
<div class="portfolio-links">
<a href="static/assets/img/portfolio/9.jpg" data-gall="portfolioGallery" class="venobox" title="Web 3"><i class="icofont-eye"></i></a>
<a href="#" title="More Details"><i class="icofont-external-link"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Our Portfolio Section -->
<!-- ======= Our Team Section ======= -->
<section id="team" class="team">
<div class="container">
<div class="section-title">
<h2>Our Team</h2>
<p>Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem.</p>
</div>
<div class="row">
<div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="200">
<div class="member">
<div class="pic"><img src="static/assets/img/team/team-3.jpg" class="img-fluid" alt=""></div>
<div class="member-info">
<h4>xiangbo zhu</h4>
<span>队长</span>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6" data-aos="fade-up" data-aos-delay="300">
<div class="member">
<div class="pic"><img src="static/assets/img/team/team-4.jpg" class="img-fluid" alt=""></div>
<div class="member-info">
<h4>Amanda Jepson</h4>
<span>贴身妹子</span>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Our Team Section -->
<!-- ======= Frequently Asked Questions Section ======= -->
<!-- ======= Contact Us Section ======= -->
<section id="contact" class="contact">
<div class="container">
<div class="section-title">
<h2>Contact Us</h2>
</div>
<div class="row">
<div class="col-lg-6 d-flex align-items-stretch" data-aos="fade-up">
<div class="info-box">
<i class="bx bx-map"></i>
<h3>Address</h3>
<p>江大长山校区文理大楼数据分析实验室</p>
</div>
</div>
<div class="col-lg-3 d-flex align-items-stretch" data-aos="fade-up" data-aos-delay="100">
<div class="info-box">
<i class="bx bx-envelope"></i>
<h3>Email Us</h3>
<p>869676614.com<br>10086.com</p>
</div>
</div>
<div class="col-lg-3 d-flex align-items-stretch" data-aos="fade-up" data-aos-delay="200">
<div class="info-box ">
<i class="bx bx-phone-call"></i>
<h3>Call Us</h3>
<p>17836925032<br>17851006312</p>
</div>
</div>
</div>
</section><!-- End Contact Us Section -->
<div class="container">
</div>
<div class="copyright">
© Copyright <strong><span>Mamba</span></strong>. All Rights Reserved
</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/ -->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
qujian.html
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width : 700px ;height:800px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
title: {
text: ‘比特币价格饼图’,
subtext: ‘前15位’,
left: ‘center’
},
tooltip: {
trigger: ‘item’,
formatter: ‘{a}
{b} : {c} ({d}%)’
},
legend: {
orient: ‘vertical’,
left: ‘left’,
data: [{{ num[0]|tojson }}, {{ num[1]|tojson }},{{ num[2]|tojson }},{{ num[3]|tojson }}, {{ num[4]|tojson }},{{ num[5]|tojson }},{{ num[6]|tojson }},{{ num[7]|tojson }},{{ num[8]|tojson }},{{ num[9]|tojson }},
{{ num[10]|tojson }},{{ num[11]|tojson }},{{ num[12]|tojson }},{{ num[13]|tojson }},{{ num[14]|tojson }}]
},
series: [
{
name: ‘访问来源’,
type: ‘pie’,
radius: ‘55%’,
center: [‘50%’, ‘60%’],
data: [
{value: {{ sum[0]|tojson }}, name: {{ num[0]|tojson }}},
{value: {{ sum[1]|tojson }}, name: {{ num[1]|tojson }}},
{value: {{ sum[2]|tojson }}, name: {{ num[2]|tojson }}},
{value: {{ sum[3]|tojson }}, name: {{ num[3]|tojson }}},
{value: {{ sum[4]|tojson }}, name: {{ num[4]|tojson }}},
{value: {{ sum[5]|tojson }}, name: {{ num[5]|tojson }}},
{value: {{ sum[6]|tojson }}, name: {{ num[6]|tojson }}},
{value: {{ sum[7]|tojson }}, name: {{ num[7]|tojson }}},
{value: {{ sum[8]|tojson }}, name: {{ num[8]|tojson }}},
{value: {{ sum[9]|tojson }}, name: {{ num[9]|tojson }}},
{value: {{ sum[10]|tojson }}, name: {{ num[10]|tojson }}},
{value: {{ sum[11]|tojson }}, name: {{ num[11]|tojson }}},
{value: {{ sum[12]|tojson }}, name: {{ num[12]|tojson }}},
{value: {{ sum[13]|tojson }}, name: {{ num[13]|tojson }}},
{value: {{ sum[14]|tojson }}, name: {{ num[14]|tojson }}}
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
};
if (option && typeof option === “object”) {
myChart.setOption(option, true);
}
</div>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
sandian.html
<div class="container">
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width : 1000px ;height:800px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = null;
var data = [[1,{{ sum[0]|tojson }},{{ yum[0]|tojson }},{{ num[0]|tojson }}],
[2,{{ sum[1]|tojson }},{{ yum[1]|tojson }},{{ num[1]|tojson }}],
[3,{{ sum[2]|tojson }},{{ yum[2]|tojson }},{{ num[2]|tojson }}],
[4,{{ sum[3]|tojson }},{{ yum[3]|tojson }},{{ num[3]|tojson }}],
[5,{{ sum[4]|tojson }},{{ yum[4]|tojson }},{{ num[4]|tojson }}],
[6,{{ sum[5]|tojson }},{{ yum[5]|tojson }},{{ num[5]|tojson }}],
[7,{{ sum[6]|tojson }},{{ yum[6]|tojson }},{{ num[6]|tojson }}],
[8,{{ sum[7]|tojson }},{{ yum[7]|tojson }},{{ num[7]|tojson }}],
[9,{{ sum[8]|tojson }},{{ yum[8]|tojson }},{{ num[8]|tojson }}],
[10,{{ sum[9]|tojson }},{{ yum[9]|tojson }},{{ num[9]|tojson }}],
[11,{{ sum[10]|tojson }},{{ yum[10]|tojson }},{{ num[10]|tojson }}],
[12,{{ sum[11]|tojson }},{{ yum[11]|tojson }},{{ num[11]|tojson }}],
[13,{{ sum[12]|tojson }},{{ yum[12]|tojson }},{{ num[12]|tojson }}],
[14,{{ sum[13]|tojson }},{{ yum[13]|tojson }},{{ num[13]|tojson }}],
[15,{{ sum[14]|tojson }},{{ yum[14]|tojson }},{{ num[14]|tojson }}],
[16,{{ sum[15]|tojson }},{{ yum[15]|tojson }},{{ num[15]|tojson }}],
[17,{{ sum[16]|tojson }},{{ yum[16]|tojson }},{{ num[16]|tojson }}],
[18,{{ sum[17]|tojson }},{{ yum[17]|tojson }},{{ num[17]|tojson }}],
[19,{{ sum[18]|tojson }},{{ yum[18]|tojson }},{{ num[18]|tojson }}],
[20,{{ sum[19]|tojson }},{{ yum[19]|tojson }},{{ num[19]|tojson }}],
[21,{{ sum[20]|tojson }},{{ yum[20]|tojson }},{{ num[20]|tojson }}],
[22,{{ sum[21]|tojson }},{{ yum[21]|tojson }},{{ num[21]|tojson }}],
[23,{{ sum[22]|tojson }},{{ yum[22]|tojson }},{{ num[22]|tojson }}],
[24,{{ sum[23]|tojson }},{{ yum[23]|tojson }},{{ num[23]|tojson }}],
[25,{{ sum[24]|tojson }},{{ yum[24]|tojson }},{{ num[24]|tojson }}],
[26,{{ sum[25]|tojson }},{{ yum[25]|tojson }},{{ num[25]|tojson }}],
[27,{{ sum[26]|tojson }},{{ yum[26]|tojson }},{{ num[26]|tojson }}],
[28,{{ sum[27]|tojson }},{{ yum[27]|tojson }},{{ num[27]|tojson }}],
[29,{{ sum[28]|tojson }},{{ yum[28]|tojson }},{{ num[28]|tojson }}],
[30,{{ sum[29]|tojson }},{{ yum[29]|tojson }},{{ num[29]|tojson }}]
],
1
option = {
backgroundColor: new echarts.graphic.RadialGradient(0.3, 0.3, 0.8, [{
offset: 0,
color: ‘#f7f8fa’
}, {
offset: 1,
color: ‘#cdd0d5’
}]),
title: {
text: ‘排名前五十市值与涨跌幅关系’
},
legend: {
right: 10,
data: [‘1’, ‘2’]
},
xAxis: {
itemStyle: {
normal: {
label: {
show: true,
positiong: ‘top’,
formatter: ‘{c}%’
}
}
},
splitLine: {
lineStyle: {
type: ‘dashed’
}
}
},
yAxis: {
axisLabel: {
formatter: ‘{value} %’
},
splitLine: {
lineStyle: {
type: ‘dashed’
}
},
scale: true
},
series: [{
name: '-',
data: data,
type: 'scatter',
symbolSize: function (data) {
return Math.sqrt(data[2]) ;
},
emphasis: {
label: {
show: true,
formatter: function (param) {
return param.data[3];
},
position: 'top'
}
},
itemStyle: {
shadowBlur: 10,
shadowColor: 'rgba(120, 36, 50, 0.5)',
shadowOffsetY: 5,
color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
offset: 0,
color: 'rgb(251, 118, 123)'
}, {
offset: 1,
color: 'rgb(204, 46, 72)'
}])
}
}]
}
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</div>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
shuju.html
<section class="counts section-bg">
<div class="container">
<table class="table table_striped">
<tr>
<td>排名</td>
<td>简称</td>
<td>全称</td>
<td>当前价格</td>
<td>24小时涨跌幅</td>
<td>交易额</td>
<td>市值</td>
</tr>
{% for movie in movies %}
<tr>
<td>{{ movie[0] }}</td>
<td>
{{ movie[1] }}
</td>
<td>{{ movie[2] }}</td>
<td>{{ movie[3] }}</td>
<td>
{{ movie[4] }}
</td>
<td>{{ movie[5] }}</td>
<td>{{ movie[6] }}</td>
</tr>
{% endfor %}
</table>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
shuliang.html
<div class="container">
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width : 1000px ;height:800px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = {
color: [‘#3398DB’],
tooltip: {
trigger: ‘axis’,
axisPointer: { // 坐标轴指示器，坐标轴触发有效
type: ‘shadow’ // 默认为直线，可选为：‘line’ | ‘shadow’
}
},
grid: {
left: ‘3%’,
right: ‘4%’,
bottom: ‘3%’,
containLabel: true
},
xAxis: [
{
type: ‘category’,
data: [‘500亿-1000亿’, ‘100亿-500亿’, ‘1亿-100亿’, ‘1000万-9999万’, ‘100万-1000万’,‘10万-100万’,‘1万-10万’],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: ‘value’
}
],
series: [
{
name: ‘数据’,
type: ‘bar’,
barWidth: ‘60%’,
data: [{{ q }}, {{ w }}, {{ e }}, {{ y }}, {{ r }}, {{ u }}, {{ t }},]
}
]
};
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</div>
</div>
</section><!-- End Counts Section -->
</div>
</section><!-- End Our Team Section -->
zhangdie.html
<div class="section-title">
<h2>比特币数据展示</h2>
</div>
<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main" style="width: 1000px ;height:750px;"></div>
<script type="text/javascript">
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
tooltip: {
trigger: ‘axis’,
position: function (pt) {
return [pt[0], ‘10%’];
}
},
title: {
left: ‘center’,
text: ‘排名前七十比特币市值涨跌图’,
},
toolbox: {
feature: {
dataZoom: {
yAxisIndex: ‘none’
},
restore: {},
saveAsImage: {}
}
},
xAxis: {
type: ‘category’,
boundaryGap: false,
data: {{ num|tojson }}
},
yAxis: {
axisLabel: {
formatter: ‘{value} %’
},
type: ‘value’,
boundaryGap: [0, ‘100%’]
},
dataZoom: [{
type: ‘inside’,
start: 0,
end: 10
}, {
start: 0,
end: 10,
handleIcon: ‘M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z’,
handleSize: ‘80%’,
handleStyle: {
color: ‘#fff’,
shadowBlur: 3,
shadowColor: ‘rgba(0, 0, 0, 0.6)’,
shadowOffsetX: 2,
shadowOffsetY: 2
}
}],
series: [
{
name: ‘数据’,
type: ‘line’,
smooth: true,
symbol: ‘none’,
sampling: ‘average’,
itemStyle: {
color: ‘rgb(255, 70, 131)’
},
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: ‘rgb(255, 158, 68)’
}, {
offset: 1,
color: ‘rgb(255, 70, 131)’
}])
},
data: {{ sum|tojson }}
}
]
};
;
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</div>
wordcloud.html
<div class="row no-gutters">
<div class="col-lg-6 video-box">
<img src="static/assets/234.jpg" class="img-fluid" alt="">
</div>
<div class="col-lg-6 d-flex flex-column justify-content-center about-content">
<div class="section-title">
<h2>词云</h2>
<p>采用比特币的名称来制作图云，当中network， 币，比特，coin，chain等词出现的频率很高，说明了比特币的命名与本身所包含的意义相关</p>
</div>
<div class="icon-box" data-aos="fade-up" data-aos-delay="100">
<div class="icon"><i class="bx bx-fingerprint"></i></div>
<h4 class="title"><a href="">Lorem Ipsum</a></h4>
<p class="description">222</p>
</div>
</div>
</div>
</div>
</section><!-- End About Us Section -->
————————————————
原文链接：https://blog.csdn.net/www100000/article/details/111721293
最新更新
python爬虫及其可视化
使用python爬取豆瓣电影短评评论内容
nodejs爬虫
Python正则表达式完全指南
爬取豆瓣Top250图书数据
shp 地图文件批量添加字段
爬虫小试牛刀（爬取学校通知公告）
【python基础】函数-初识函数
【python基础】函数-返回值
HTTP请求：requests模块基础使用必知必会
SQL SERVER中递归
2个场景实例讲解GaussDB(DWS)基表统计信息估
常用的 SQL Server 关键字及其含义
动手分析SQL Server中的事务中使用的锁
openGauss内核分析：SQL by pass & 经典执行
一招教你如何高效批量导入与更新数据
天天写SQL，这些神奇的特性你知道吗？
openGauss内核分析：执行计划生成
[IM002]Navicat ODBC驱动器管理器 未发现数据
初入Sql Server 之 存储过程的简单使用
uniapp/H5 获取手机桌面壁纸 (静态壁纸）
[前端] DNS解析与优化
为什么在js中需要添加addEventListener（）？
JS模块化系统
js通过Object.defineProperty() 定义和控制对象
这是目前我见过最好的跨域解决方案！
减少回流与重绘
减少回流与重绘
如何使用KrpanoToolJS在浏览器切图
performance.now() 与 Date.now() 对比