iBetter Books
수정

커스텀 템플릿 만들기

simple_white가 마음에 들었지만, 지윤에게는 한 가지 남은 과제가 있었습니다. 학교 브랜드 색상인 남색 #1B3A5C를 차트 전체에 통일되게 적용하는 것. 내장 템플릿에는 이 색상이 없었습니다.

"그럼 만들면 되지."

Plotly는 커스텀 템플릿을 만들고 등록하는 기능을 제공합니다. 한 번 만들어두면 내장 템플릿처럼 이름으로 불러올 수 있습니다.

템플릿 기본 구조

go.layout.Template 객체를 만들어 pio.templates에 등록합니다.

import plotly.io as pioimport plotly.graph_objects as go# 기본 템플릿 틀my_template = go.layout.Template(    layout=go.Layout(        # 여기에 layout 속성을 설정    ))# 이름을 붙여 등록pio.templates["my_template"] = my_template

주요 layout 속성

커스텀 템플릿에서 자주 설정하는 속성들입니다.

속성 설명
font 전체 폰트 (family, size, color)
colorway 범주형 차트의 기본 색상 목록
paper_bgcolor 차트 외곽 배경색
plot_bgcolor 차트 영역 배경색
title 제목 기본 스타일
xaxis, yaxis 기본 축 스타일

실전: 학교 브랜드 템플릿 만들기

학교 브랜드 색상 #1B3A5C를 중심으로 커스텀 템플릿을 만들어봅니다. 보조 색상으로 밝은 파란색 계열을 추가하고, 깔끔한 흰 배경을 기본으로 설정합니다.

# 새 파일: custom_template.pyimport plotly.io as pioimport plotly.graph_objects as goimport plotly.express as px# 학교 브랜드 색상 팔레트BRAND_COLORS = [    "#1B3A5C",   # 남색 (메인)    "#4A90D9",   # 밝은 파란색    "#7FB3E0",   # 연한 파란색    "#E67E22",   # 주황색 (강조)    "#2ECC71",   # 초록색    "#E74C3C",   # 빨간색    "#9B59B6",   # 보라색    "#F39C12",   # 노란색]# 커스텀 템플릿 정의school_template = go.layout.Template(    layout=go.Layout(        # 색상 팔레트        colorway=BRAND_COLORS,        # 배경        paper_bgcolor="white",        plot_bgcolor="white",        # 폰트        font=dict(            family="Malgun Gothic, AppleGothic, sans-serif",            size=13,            color="#2C3E50"        ),        # 제목 스타일        title=dict(            font=dict(                size=18,                color="#1B3A5C",                family="Malgun Gothic, AppleGothic, sans-serif"            ),            x=0.05        ),        # X축 기본 스타일        xaxis=dict(            showgrid=True,            gridcolor="#ECF0F1",            gridwidth=1,            linecolor="#BDC3C7",            linewidth=1,            showline=True,            zeroline=False        ),        # Y축 기본 스타일        yaxis=dict(            showgrid=True,            gridcolor="#ECF0F1",            gridwidth=1,            linecolor="#BDC3C7",            linewidth=1,            showline=True,            zeroline=False        ),        # 범례 스타일        legend=dict(            bgcolor="rgba(255,255,255,0.8)",            bordercolor="#BDC3C7",            borderwidth=1        )    ))# 템플릿 등록pio.templates["school"] = school_template# 전역 기본값으로 설정pio.templates.default = "school"# 이제 모든 차트에 school 템플릿이 적용됨quarters = ["1Q", "2Q", "3Q", "4Q"]sales_a = [120, 145, 132, 178]sales_b = [95, 110, 125, 140]sales_c = [80, 88, 102, 115]fig = go.Figure()fig.add_trace(go.Bar(x=quarters, y=sales_a, name="팀 A"))fig.add_trace(go.Bar(x=quarters, y=sales_b, name="팀 B"))fig.add_trace(go.Bar(x=quarters, y=sales_c, name="팀 C"))fig.update_layout(    title_text="분기별 팀 실적 비교",    barmode="group",    xaxis_title="분기",    yaxis_title="실적 (억원)")fig.show()

실행 결과

school 템플릿이 적용되어 남색 계열 색상과 깔끔한 흰 배경으로 분기별 팀 실적 막대 그래프가 표시됩니다. 마우스를 막대 위에 올리면 정확한 수치를 확인할 수 있습니다.

내장 템플릿과 조합하기

커스텀 템플릿을 내장 템플릿 위에 덧씌울 수도 있습니다. "simple_white+school" 형태로 +로 연결하면 됩니다. 먼저 적용된 템플릿 위에 뒤의 템플릿이 덮어씁니다.

# 새 파일: combined_template.pyimport plotly.io as pioimport plotly.graph_objects as go# school 템플릿은 앞의 코드에서 이미 등록되어 있음# simple_white를 베이스로, school 설정을 추가로 적용fig = go.Figure(    data=[        go.Bar(x=["A", "B", "C"], y=[10, 20, 15])    ],    layout=go.Layout(        title_text="조합 템플릿 예시",        template="simple_white+school"    ))fig.show()

실행 결과

simple_white와 school 템플릿이 결합되어 간결한 흰 배경 위에 브랜드 색상이 적용된 막대 그래프가 나타납니다.

템플릿 재사용

커스텀 템플릿은 파이썬 파일이나 JSON으로 저장해서 프로젝트 전반에 재사용할 수 있습니다.

# 새 파일: save_template.pyimport jsonimport plotly.io as pio# 템플릿을 JSON으로 저장template_json = pio.templates["school"].to_json()with open("school_template.json", "w", encoding="utf-8") as f:    f.write(template_json)# 저장된 템플릿 불러오기with open("school_template.json", "r", encoding="utf-8") as f:    loaded = json.load(f)import plotly.graph_objects as gopio.templates["school_loaded"] = go.layout.Template(    layout=go.Layout(loaded.get("layout", {})))

지윤은 custom_template.py를 프로젝트 공용 파일로 만들어서 팀원들에게 공유했습니다. 이제 팀 전체가 같은 색상으로 차트를 만들 수 있게 됐습니다.

"이거 하나 만들어두니까 편하다. 매번 색 코드 복사 안 해도 돼."

준호의 반응이었습니다.