重新加载一个 csv 文件并用它调用相同的视图
Reload a csv file and call the same view with it
我有两个模板(initial.html
和 index.html
),其中包含一个表单。我使用此表单中的数据生成一个 csv (data.csv
),然后在 index.html
中读取它,这要感谢 d3
和 parcoords.js
。每个新提交都会生成一个新的 data.csv
问题是,在第一次调用时,一切似乎都正常,但是当我尝试使用新值提交表单时,可视化效果并没有改变(即使文件 data.csv
在我提交时似乎发生了变化使用 TextEdit 打开它)
此外,我提供给视图的数据(values
in main.py
)也没有改变。
我知道不建议在 POST 提交后调用相同的视图,但即使我尝试调用不同的视图,下面描述的两个问题仍然存在。
相关部分代码如下:
main.py
@app.route('/', methods=['POST','GET'])
def main():
global maxDepth
global numberOfRelated
if request.method=='POST':
url = request.form['url']
maxDepth = int(request.form['depth'])
numberOfRelated = int(request.form['numberOfRelated'])
values = crawling(url,maxDepth,numberOfRelated)
return render_template('index.html',var=values)
return render_template('initial.html')
crawling
函数
def crawling(url,maxDepth,numberOfRelated):
start = time.time()
initialID = get_id(url)
videosId.append([0,initialID])
getAllID(1,initialID)
getVideoData(videosId)
if os.path.exists('static/csv/data.csv'):
os.remove('static/csv/data.csv')
with open('static/csv/data.csv','wb') as csvData:
dataWriter = csv.writer(csvData, delimiter='|', quotechar='|', quoting=csv.QUOTE_MINIMAL)
dataWriter.writerow(['Depth']+['ID']+['Title']+['Popularity']+['Occurency'])
for x in xrange(0,len(videosData)):
dataWriter.writerow([videosData[x].level]+[videosData[x].id]+[videosData[x].title.encode("utf-8")]+[videosData[x].popularite]+[videosData[x].occurence])
timeExecution = round(time.time() - start,1)
mostFrequent = mostFrequentVideo()
mostPopular = mostPopularVideo()
initialVideo = videosData[0]
return [initialVideo,mostPopular, mostFrequent, len(videosData), timeExecution]
表格
<nav class="navbar formSpace">
<div class="container">
<form class="form-inline" action="" method="POST">
<div class="service form-group">
<i class="fa fa-youtube fa-2x"></i>
</div>
<div class="form-group">
<input type="text" class="form-control" id="mainForm" placeholder="https://www.youtube.com/watch?v=2HIuN5lxMCI" name="url" />
</div>
<div class="form-group minorForm">
<input name='numberOfRelated' type="text" class="form-control" placeholder="Number of suggestion" />
</div>
<div class="form-group minorForm">
<input name='depth' type="text" class="form-control" placeholder="depth" />
</div>
<div class="form-group navbar-right">
<button class="btn btn-success minorForm generate" type="submit"> Generate</button>
</div>
</form>
</div>
</nav>
main.js
var pc0;
var blue_to_brown = d3.scale.linear()
.domain([0, 5])
.range(["red", "#3498db"])
.interpolate(d3.interpolateLab);
d3.csv('static/csv/data.csv?_='+ Math.random(), function(data) {
pc0 = d3.parcoords()("#example0")
.data(data)
.showControlPoints(false)
.hideAxis(["Title"])
.hideAxis(["ID"])
.composite("darker")
.width(860)
.color(function(d) { return blue_to_brown(d['Depth']);})
.render()
.alpha(0.35)
.brushMode("1D-axes")
.reorderable()
.interactive();
});
Flask 提供静态文件,告诉浏览器相当积极地缓存 文件。默认是告诉浏览器将文件缓存 12 小时。
您可以通过向 URL;
添加一个随机值来绕过此缓存
d3.csv('static/csv/data.csv?_=' + Math.random(), function(data) {
现在浏览器每次都会将其视为一个新文件 URL 并且不会重复使用缓存文件。
好吧,我终于找到了解决办法
Martijn Pieters 建议的技巧非常有效,问题出在我的 CSV 格式上。 (我使用的是“|”而不是“,”,而 D3 不喜欢那样)
我有两个模板(initial.html
和 index.html
),其中包含一个表单。我使用此表单中的数据生成一个 csv (data.csv
),然后在 index.html
中读取它,这要感谢 d3
和 parcoords.js
。每个新提交都会生成一个新的 data.csv
问题是,在第一次调用时,一切似乎都正常,但是当我尝试使用新值提交表单时,可视化效果并没有改变(即使文件 data.csv
在我提交时似乎发生了变化使用 TextEdit 打开它)
此外,我提供给视图的数据(values
in main.py
)也没有改变。
我知道不建议在 POST 提交后调用相同的视图,但即使我尝试调用不同的视图,下面描述的两个问题仍然存在。
相关部分代码如下:
main.py
@app.route('/', methods=['POST','GET'])
def main():
global maxDepth
global numberOfRelated
if request.method=='POST':
url = request.form['url']
maxDepth = int(request.form['depth'])
numberOfRelated = int(request.form['numberOfRelated'])
values = crawling(url,maxDepth,numberOfRelated)
return render_template('index.html',var=values)
return render_template('initial.html')
crawling
函数
def crawling(url,maxDepth,numberOfRelated):
start = time.time()
initialID = get_id(url)
videosId.append([0,initialID])
getAllID(1,initialID)
getVideoData(videosId)
if os.path.exists('static/csv/data.csv'):
os.remove('static/csv/data.csv')
with open('static/csv/data.csv','wb') as csvData:
dataWriter = csv.writer(csvData, delimiter='|', quotechar='|', quoting=csv.QUOTE_MINIMAL)
dataWriter.writerow(['Depth']+['ID']+['Title']+['Popularity']+['Occurency'])
for x in xrange(0,len(videosData)):
dataWriter.writerow([videosData[x].level]+[videosData[x].id]+[videosData[x].title.encode("utf-8")]+[videosData[x].popularite]+[videosData[x].occurence])
timeExecution = round(time.time() - start,1)
mostFrequent = mostFrequentVideo()
mostPopular = mostPopularVideo()
initialVideo = videosData[0]
return [initialVideo,mostPopular, mostFrequent, len(videosData), timeExecution]
表格
<nav class="navbar formSpace">
<div class="container">
<form class="form-inline" action="" method="POST">
<div class="service form-group">
<i class="fa fa-youtube fa-2x"></i>
</div>
<div class="form-group">
<input type="text" class="form-control" id="mainForm" placeholder="https://www.youtube.com/watch?v=2HIuN5lxMCI" name="url" />
</div>
<div class="form-group minorForm">
<input name='numberOfRelated' type="text" class="form-control" placeholder="Number of suggestion" />
</div>
<div class="form-group minorForm">
<input name='depth' type="text" class="form-control" placeholder="depth" />
</div>
<div class="form-group navbar-right">
<button class="btn btn-success minorForm generate" type="submit"> Generate</button>
</div>
</form>
</div>
</nav>
main.js
var pc0;
var blue_to_brown = d3.scale.linear()
.domain([0, 5])
.range(["red", "#3498db"])
.interpolate(d3.interpolateLab);
d3.csv('static/csv/data.csv?_='+ Math.random(), function(data) {
pc0 = d3.parcoords()("#example0")
.data(data)
.showControlPoints(false)
.hideAxis(["Title"])
.hideAxis(["ID"])
.composite("darker")
.width(860)
.color(function(d) { return blue_to_brown(d['Depth']);})
.render()
.alpha(0.35)
.brushMode("1D-axes")
.reorderable()
.interactive();
});
Flask 提供静态文件,告诉浏览器相当积极地缓存 文件。默认是告诉浏览器将文件缓存 12 小时。
您可以通过向 URL;
添加一个随机值来绕过此缓存d3.csv('static/csv/data.csv?_=' + Math.random(), function(data) {
现在浏览器每次都会将其视为一个新文件 URL 并且不会重复使用缓存文件。
好吧,我终于找到了解决办法
Martijn Pieters 建议的技巧非常有效,问题出在我的 CSV 格式上。 (我使用的是“|”而不是“,”,而 D3 不喜欢那样)