[Django] 엑셀 데이터 출력 페이지 만들기(부록) - 결과값을 표로 깔끔하게 보여주기(pandas dataframe > django)

웹페이지에 엑셀 데이터의 값들을 요약해서 보여주는 것까지 완성했다.

그런데 좀 더 가독성있게 표로 제시하는 방법도 찾아보았다.👀

 

여기서는 pandas 데이터프레임을 django에서 html에 표시되게 하는 방법을 살펴본다.

 

1. result 함수 수정

• calculate > views.py > calculate 함수 수정
• 기본적으로 result 함수에 출력되는 결과값을 데이터프레임으로 변환하고, 세션에 저장해야한다.
• 이를 위해 calculate 함수를 먼저 수정한다.
• grade 별 value 통계량 요약
  • groupby 함수를 사용 : grade 컬럼을 기준으로, value 값에 min, max, mean 함수를 적용
  • index를 새로고침하고, 컬럼 값을 재지정
  • 깔끔한 출력을 위해 min, max, mean(avg) 값의 데이터타입을 지정
  • pandas 데이터프레임을 html 에 보기좋게 구현하기 위해, df.style을 사용 : index 를 숨기고, css 스타일 적용
  • to_html() 함수를 통해 데이터프레임이 html 에 나타나도록 하고, 이를 세션에 저장한다
• 이메일 도메인 별 사용자수 요약도 동일하게 진행

def calculate(request):
    file = request.FILES['fileInput']
    print("사용자가 등록한 파일 이름: ", file)
    df = pd.read_excel(file, sheet_name="Sheet1", header=0)
    print(df.head())
    >>여기까지 엑셀 파일의 데이터를 불러옴
    
    # grade 별 value 통계량 요약
    grade_df = df.groupby('grade')['value'].agg(["min", "max", "mean"]).reset_index().rename(columns = {"mean": "avg"})
    grade_df = grade_df.astype({"min":"int", "max":"int", "avg": "float"})
    print(grade_df.dtypes)

    grade_df = grade_df.style.hide(axis="index").set_table_attributes('class ="table table-dark"')
    grade_calculate_pd_to_session = {'grade_df' : grade_df.to_html(justify='center')}
    request.session['grade_calculate_pd_dic'] = grade_calculate_pd_to_session
    print("")
    
    # 이메일 도메인 별 사용자 수 요약
    df['domain'] = df['email'].apply(lambda x : x.split("@")[1])
    email_df = df.groupby('domain')['value'].agg("count").sort_values(ascending=False).reset_index()
    email_df = email_df.style.hide(axis='index').set_table_attributes('class="table table-dark"')
    email_calculate_pd_to_session = {'email_df' : email_df.to_html(justify='center')}
    request.session['email_calculate_pd_dic'] = email_calculate_pd_to_session
    print(email_df)

    return redirect("/result")

 

 

2. result 함수 수정

• main > views.py > result 함수 수정
• 앞서 세션에 저장했던 데이터프레임을 불러와 content에 저장한다
• 기존 세션 데이터는 삭제한다
• return 에 content 가 포함되어 있음을 확인하고 마무리!

def result(request):
    if 'user_name' in request.session.keys():
        #보안을 위해 새로운 객체에 저장
        content = {}
        content['grade_calculate_dic'] = request.session['grade_calculate_dic']
        content['email_domain_dic'] = request.session['email_domain_dic']
        content['grade_calculate_pd_dic'] = request.session['grade_calculate_pd_dic']
        content['email_calculate_pd_dic'] = request.session['email_calculate_pd_dic']

        #print(content['grade_calculate_pd_dic'])
        #print(content['email_calculate_pd_dic'])

        #기존 세션 삭제
        del request.session['grade_calculate_dic']
        del request.session['email_domain_dic']
        del request.session['grade_calculate_pd_dic']
        del request.session['email_calculate_pd_dic']

        return render(request, "main/result.html", content)     #사용자 세션 정보가 담긴 상태에서의 result.html
    else:
        return redirect('main_signin')

 

3. result.html 수정

• html 에 데이터프레임을 출력하기 위해 다음 코드를 입력한다.
  • 세션에 키 값이 저장되어 있다면, 밸류(데이터프레임)을 불러온다는 뜻
• 기본적으로 css로 스타일을 적용했으므로 다음 코드를 포함해야 한다.
  • <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

        {% if grade_calculate_pd_dic %}  
        {{ grade_calculate_pd_dic.grade_df|safe }}
        {% endif %}
        <hr>
        {% if email_calculate_pd_dic %}  
        {{ email_calculate_pd_dic.email_df|safe }}
        {% endif %}

 

결과 확인