app.py

from logging import log
from dash import Dash, html, dcc, callback, Output, Input
import pandas as pd
import plotly.express as px
from plotly.graph_objs import scatter
import plotly.graph_objects as go
df = pd.read_csv('1711709179672.csv',na_values="None")

df.insert(4,"Size",(10 * df["Amount"].abs())/100)

df['Departments'].fillna("no departments",inplace=True)




app = Dash(__name__)


app.layout = html.Div(children = [
    html.Div(
            className="row",
            children=[
                html.Div(
                    className="four columns div-user-controls",
                    children=[
                        html.H2("XPENCE-INSIGHT"),
                        html.H3("""Visualising Xpence transaction"""),
                        html.H4("""Pick one User from the dropdown below."""),
                    ],
                ),
                html.Div(
                    
                    className="eight columns div-for-charts bg-grey",
                    
                    children=[
            dcc.Dropdown(
                df['Card holder'].unique(),
                'Radu Pertescu',
                id='xaxis-column',
                placeholder= "Radu Pertescu",
               
            ),
            dcc.Graph(id="scatterGraph",animate=True),
            dcc.Graph(id='barGraph'),
            dcc.Graph(id='areaGraph'),
            dcc.Graph(id='histogramGraph')
                    ]
                ),
            ]
    ),
    
    #dcc.Graph(figure=px.scatter(df,x="Transaction Date", y="Amount")),
    
    ##dcc.Graph(figure=px.funnel(df,x='Amount',y='Category'))
    #dcc.Graph(figure=px.scatter(df,x="Amount", y="Transaction Date",color="Card holder")),
    # dcc.Graph(figure=px.icicle(df,path=[px.Constant("all"), 'Approval Status', 'Card holder','Category'],color='Category',color_continuous_scale='RdBu')),
    
    # dcc.Graph(figure=px.sunburst(df,path=["Transaction Type","Card holder","Approval Status"],color='Amount')),
    # dcc.Graph(figure=px.parallel_categories(df,dimensions=["Card holder","Category","Branches","Departments","Approval Status","Receipt"],color="Amount")),
    # dcc.Graph(figure=px.scatter(df,x="Amount", y="Merchant",color="Card holder",opacity=0.7)),

   

])


@callback(
    Output("scatterGraph","figure"),
    Input("xaxis-column","value")
    
)
def update_graph(userName):
    filtered_df = df[df["Card holder"] == userName]
    fig = px.scatter(filtered_df,x="Amount", y="Transaction Date",color="Transaction Type",title="Transaction type and amount based on date")
    
    return fig


@callback(
    Output("barGraph","figure"),
    Input("xaxis-column","value")
)
def update_bar_graph(userName):
    filtered_df = df[df["Card holder"] == userName]
    count_data_frame = filtered_df
    count_data_frame = filtered_df.groupby('Category').count().reset_index()
    fig = px.bar(count_data_frame,x="Category", y="Amount",color='Category',title="Category count")
    return fig

@callback(
    Output("areaGraph","figure"),
    Input("xaxis-column","value")
)
def update_area_graph(userName):
    filtered_df = df[df["Card holder"] == userName]
    filtered_df['Transaction Date'] = pd.to_datetime(filtered_df['Transaction Date'],format='%d/%m/%Y %H:%M')
    filtered_df['Transaction Date'] = filtered_df['Transaction Date'].dt.round('D')
    filtered_df['Transaction Date'].dt.strftime("%Y-%m-%d")
    transaction_data_frame = filtered_df
    transaction_data_frame = filtered_df.groupby('Transaction Date').count().reset_index()
    fig = px.area(transaction_data_frame,x='Transaction Date',y='Amount',markers=True,title="Number of transaction on a single day")
    return fig


@callback(
    Output("histogramGraph","figure"),
    Input("xaxis-column","value")
)
def update_histogram_graph(userName):
    filtered_df = df[df["Card holder"] == userName]
    fig=px.histogram(filtered_df,x='Approval Status',color="Approval Status",title="Approval status count")
    return fig


if __name__ == '__main__':
    app.run(port='7860',debug=True,host='0.0.0.0')