How to round decimal places in a Dash Table

Question

I have the following python code:

import dash
import dash_html_components as html
import pandas as pd

df = pd.read_csv('https://raw.githubusercontent.com/dougmellon/rockies_dash/master/rockies_2019.csv')

def generate_table(dataframe, max_rows=10):
    return html.Table(
        # Header
        [html.Tr([html.Th(col) for col in dataframe.columns])] +

        # Body
        [html.Tr([
            html.Td(dataframe.iloc[i][col]) for col in dataframe.columns
        ]) for i in range(min(len(dataframe), max_rows))]
    )


external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

app.layout = html.Div(children=[
    html.H4('Batting Stats (2019)'),
    generate_table(df)
])

if __name__ == '__main__':
    app.run_server(debug=True)

which is pulling data from this csv file (github):

When I run the following code,

python app.py

It displays data with greater than three decimals - which isn't in my csv file.

I have tried three or four times to reenter the data manually and re-upload the CSV to github but for some reason there is still data with greater than three decimals.

Does anyone have any suggestions as to how I could possibly fix this issue?

Answer 1

You need to pass per-column type and format specifiers in the columns argument of the Dash DataTable constructor along the lines of

DataTable(..., columns=[{'id': 'one', 'type':'numeric', 'format': {'specifier': '.2f'}}])