CSS 기본 색상표

Plotly 기본제공 색상표 (CSS Named Colors)

 

개요 

    Plotly에서 제공하는 네임드 컬러를 차트에 출력해 보자. 

 

 

 Plotly CSS Named Colors

    아래는 Plotly에서 제공하는 색상이름이다. 기본적으로 제공되기 때문에 RGB값을 모르더라도 색상 이름만 가지고 해당 색상을 그대로 사용할 수 있다. 

 

       "aliceblue, antiquewhite, aqua, aquamarine, azure,\
        beige, bisque, black, blanchedalmond, blue,\
        blueviolet, brown, burlywood, cadetblue,\
        chartreuse, chocolate, coral, cornflowerblue,\
        cornsilk, crimson, cyan, darkblue, darkcyan,\
        darkgoldenrod, darkgray, darkgrey, darkgreen,\
        darkkhaki, darkmagenta, darkolivegreen, darkorange,\
        darkorchid, darkred, darksalmon, darkseagreen,\
        darkslateblue, darkslategray, darkslategrey,\
        darkturquoise, darkviolet, deeppink, deepskyblue,\
        dimgray, dimgrey, dodgerblue, firebrick,\
        floralwhite, forestgreen, fuchsia, gainsboro,\
        ghostwhite, gold, goldenrod, gray, grey, green,\
        greenyellow, honeydew, hotpink, indianred, indigo,\
        ivory, khaki, lavender, lavenderblush, lawngreen,\
        lemonchiffon, lightblue, lightcoral, lightcyan,\
        lightgoldenrodyellow, lightgray, lightgrey,\
        lightgreen, lightpink, lightsalmon, lightseagreen,\
        lightskyblue, lightslategray, lightslategrey,\
        lightsteelblue, lightyellow, lime, limegreen,\
        linen, magenta, maroon, mediumaquamarine,\
        mediumblue, mediumorchid, mediumpurple,\
        mediumseagreen, mediumslateblue, mediumspringgreen,\
        mediumturquoise, mediumvioletred, midnightblue,\
        mintcream, mistyrose, moccasin, navajowhite, navy,\
        oldlace, olive, olivedrab, orange, orangered,\
        orchid, palegoldenrod, palegreen, paleturquoise,\
        palevioletred, papayawhip, peachpuff, peru, pink,\
        plum, powderblue, purple, red, rosybrown,\
        royalblue, rebeccapurple, saddlebrown, salmon,\
        sandybrown, seagreen, seashell, sienna, silver,\
        skyblue, slateblue, slategray, slategrey, snow,\
        springgreen, steelblue, tan, teal, thistle, tomato,\
        turquoise, violet, wheat, white, whitesmoke,\
        yellow, yellowgreen"

 

 

예제 

    다음은 위 CSS named color를 가지고 그대로 차트에 색상과 함께 텍스트도 출력하는 예제이다. 주피터 노트북에서 실행하기 바란다. 

colors = \
        "aliceblue, antiquewhite, aqua, aquamarine, azure,\
        beige, bisque, black, blanchedalmond, blue,\
        blueviolet, brown, burlywood, cadetblue,\
        chartreuse, chocolate, coral, cornflowerblue,\
        cornsilk, crimson, cyan, darkblue, darkcyan,\
        darkgoldenrod, darkgray, darkgrey, darkgreen,\
        darkkhaki, darkmagenta, darkolivegreen, darkorange,\
        darkorchid, darkred, darksalmon, darkseagreen,\
        darkslateblue, darkslategray, darkslategrey,\
        darkturquoise, darkviolet, deeppink, deepskyblue,\
        dimgray, dimgrey, dodgerblue, firebrick,\
        floralwhite, forestgreen, fuchsia, gainsboro,\
        ghostwhite, gold, goldenrod, gray, grey, green,\
        greenyellow, honeydew, hotpink, indianred, indigo,\
        ivory, khaki, lavender, lavenderblush, lawngreen,\
        lemonchiffon, lightblue, lightcoral, lightcyan,\
        lightgoldenrodyellow, lightgray, lightgrey,\
        lightgreen, lightpink, lightsalmon, lightseagreen,\
        lightskyblue, lightslategray, lightslategrey,\
        lightsteelblue, lightyellow, lime, limegreen,\
        linen, magenta, maroon, mediumaquamarine,\
        mediumblue, mediumorchid, mediumpurple,\
        mediumseagreen, mediumslateblue, mediumspringgreen,\
        mediumturquoise, mediumvioletred, midnightblue,\
        mintcream, mistyrose, moccasin, navajowhite, navy,\
        oldlace, olive, olivedrab, orange, orangered,\
        orchid, palegoldenrod, palegreen, paleturquoise,\
        palevioletred, papayawhip, peachpuff, peru, pink,\
        plum, powderblue, purple, red, rosybrown,\
        royalblue, rebeccapurple, saddlebrown, salmon,\
        sandybrown, seagreen, seashell, sienna, silver,\
        skyblue, slateblue, slategray, slategrey, snow,\
        springgreen, steelblue, tan, teal, thistle, tomato,\
        turquoise, violet, wheat, white, whitesmoke,\
        yellow, yellowgreen"

# 공란은 삭제하고, 콤마(,)를 기준으로 하여 리스트화 한다. 
colors = colors.replace(" ","").split(",")

# 색상 개수 확인
print("색상개수: ", len(colors))

# Plotly 임포트 
import plotly.graph_objects as go

# Figure 생성 
fig = go.Figure()

# 글자 디스플레이 
i = 0
for x in range(10):
    for y in range(20):
        if i < len(colors)-1:
            i += 1
            # (x+1,y+1) 지점에 색상 텍스트 표시 
            fig.add_annotation(text="<b>"+colors[i]+"</b>", 
                               font=dict(size=15, color=colors[i]), 
                               textangle=-20, x=x+1, y=y+1, showarrow=False)

# 제목, 배경색, Figure Size             
fig.update_layout(title=dict(text="<b>Plotly CSS Named Colors</b>", font=dict(size=30)), 
                  plot_bgcolor='rgb(0,0,0)', paper_bgcolor='rgb(0,0,0)', width=850, height=1200)
# 축 Tick 조건, Range, Grid
fig.update_xaxes(tick0=0, dtick=1, gridcolor='rgba(100,100,100,0.2)', griddash='dot', range=[0,9])
fig.update_yaxes(tick0=0, dtick=1, gridcolor='rgba(100,100,100,0.2)', griddash='dot', range=[0,21])

# 파일 저장 버튼 옵션 
config = {
  'toImageButtonOptions': {
    'format': 'png', 
    'filename': 'custom_image',
    'height': 1200,
    'width': 850,
    'scale': 2 
  }
}

# Figure 보이기 
fig.show(config=config)

Plotly Color, Plotly CSS, Plotly RGB, Plotly Color code, Plotly Colormap,Plotly color_continuous_scale, Plotly color_discrete_sequence, color_discrete_sequence, Plotly colorbar, Plotly 컬러맵, Plotly 컬러바

 

 

 

    도움되셨다면 하트(♥) 부탁드리고, 더 궁금한 사항은 댓글로 남겨주세요 :)