반응형
1. Plotly 란? plotly.com
잘은 모르겠다. 자바스크립트에 기반한 시각화 모듈이다. 맷플롯립(MatPlotLib) 보다 훨씬 깔끔하고 다양한 기능을 제공한다. enterprise 비즈니스모델이 있어서 그런지 세세하기 들어가기 시작하면 설명이 그렇게 친절하지 않은 점은 있으나, 사용자 커뮤니티를 활용하면 되는 거니까.
중요한건, Interactive 하면서 동시에 fancy 한 시각화가 가능한데, 간편하다는 것.
2. 설치하기
티스토리에 그래프를 넣기 위해서는 구조만 이해하면 되기 때문에 python 및 plotly library의 클라이언트 설치는 불필요하다. 하지만, python으로 코드를 짤 사람들만 pip을 이용하자.
$ pip install plotly[참고] 데이터구조
plotly의 데이터는 2개의 하부 구조로 나뉘며, json, dictionary, list 등 다양한 방법으로 사용가능하다. 티스토리에서는 가볍게 사용하기 위해 json을 사용할 것이다.
- [필수] data : 차트의 종류 및 대상 차트의 값
- [옵션] layout : title, axis, font, color 등 꾸밈용
[스킨편집] 헤더에 자바스크립트 파일 넣기
각자의 버전관리 취향에 따라 티스토리에 js파일을 업로드하거나 온라인 파일을 연결해두자.
내 취향은 온라인 & 최신이다. 스킨편집 → html편집 → html → <head> 와 </head> 사이에 다음을 삽입하자.
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>준비는 끝났다.
3. 글에 그래프 넣기
글 작성 시 html 모드로 다음과 같이 id를 graph로 지정하고 스크립트를 작성하면 된다.
<div id="graph">
<script>
Plotly.plot('graph',
### JSON 형식으로 데이터 넣기 ###
, {} );
</script>
</div>더보기
[참고] python 코드작성 시 JSON 추출
# python 코드 상에서는 to_json() 함수로 JSON 형식의 데이터 추출이 가능하다.
# https://plotly.com/python/creating-and-updating-figures/#converting-graph-objects-to-dictionaries-and-json
import plotly.graph_objects as go
fig = go.Figure(
data=[go.Bar(x=[1, 2, 3], y=[1, 3, 2])],
layout=go.Layout(height=400, width=600)
)
fig.layout.template = None # to slim down the output
print(str(fig.to_json())) # 참고할 것!
[예제]
<div id="graph">
<script>
Plotly.plot('graph',
{
"data":[{"x":[1,2,3],"y":[1,3,2],"type":"bar"}],
"layout":{"height":400,"width":600}
}
, {} );
</script>
</div>
반응형
'파이썬 (투자분석용) > Plotly 및 Dash' 카테고리의 다른 글
| [app] 한국주식의 종목별 MDD(최대낙폭) 확인하기 (0) | 2022.02.14 |
|---|---|
| [python, plotly] 이동평균 그리기 (0) | 2022.02.09 |
| [python, plotly] 캔들(candlestick) 차트 그리기 (0) | 2022.02.05 |
| 한국증시 한 눈에 보기 feat. by finviz (0) | 2022.02.02 |
| Dash app을 Heroku에 배포(Deploy) 하기 (0) | 2022.01.22 |
댓글