2016-01-22 60 views
0

我正在使用分頁轉換將Pandas數據框分成不連續的部分。 Pagination.info的格式與pagination example類似,但.links顯示爲項目符號點!燒瓶分頁鏈接格式不正確

enter image description here

序我前端新手。

蟒蛇:

@app.route('/') 
def show_tables(): 
    data = pd.read_csv('dbO18_2015.csv',index_col=0) 

    # Formatting and preprocessing 
    pd.options.display.float_format = '{:20,.2f}'.format 
    data['depth']=data['depth'].astype(int) 
    data.index +=1 

    # will be user input eventually... 
    PER_PAGE = 100 
    cols = ['lat','lon','depth','temp','sal','d18o','dD','year','month','ref'] 

    # pagination example 
    search = False 
    q = request.args.get('q') 
    if q: 
     search = True 
    try: 
     page = int(request.args.get('page', 1)) 
    except ValueError: 
     page = 1 

    pagination = Pagination(page=page, total=len(data), search=search, record_name='records',per_page=PER_PAGE) 

    return render_template('view.html',tables=data[(page-1)*PER_PAGE:page*PER_PAGE][cols].to_html(classes='niceTable'), 
     titles = 'D18O',pagination=pagination) 

CSS:

body   { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;} 
a, h1, h2  { color: #377ba8; } 
h1, h2   { margin: 0; } 
h1    { border-bottom: 2px solid #eee; } 
h2    { font-size: 1.2em; } 


.pagination-page-info { 
    padding: .6em; 
    padding-left: 0; 
    width: 40em; 
    margin: .5em; 
    margin-left: 0; 
    font-size: 12px; 
} 
.pagination-page-info b { 
    color: black; 
    background: #6aa6ed; 
    padding-left: 2px; 
    padding: .1em .25em; 
    font-size: 150%; 
} 

table.dataframe, .dataframe th, .dataframe td { 
    border: none; 
    border-bottom: 1px solid #C8C8C8; 
    border-collapse: collapse; 
    text-align:left; 
    padding: 10px; 
    margin-bottom: 40px; 
    font-size: 0.9em; 
} 

.niceTable th { 
    background-color: #6aa6ed; 
    color: white; 
} 

tr:nth-child(odd)  { background-color:#eee; } 
tr:nth-child(even) { background-color:#fff; } 
tr:hover   { background-color: #ffff99;} 

HTML:

<!doctype html> 
<title>Simple tables</title> 
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='style.css') }}"> 
<div class=page> 
<h1>Global Seawater Oxygen-18</h1> 

<h2>{{titles}}</h2> 
{{ pagination.info }} 
{{ pagination.links }} 
<div class="table-responsive"> 
    <table class="table table-hover"> 
     {{ tables|safe }} 
    </table> 
</div> 
{{ pagination.links }} 

</div> 

回答

1

您需要包括引導的CSS。

+0

謝謝你,那就像一個魅力:) –