지난 포스팅에서 Bokeh에서 제작한 pie chart의 내용을 올렸습니다. Bokeh의 특성상 pie chart 위에 마우스 커서를 올리면 해당 카테고리의 value가 즉각적으로 반응합니다. 만약 같은 내용을 이미지나 텍스트 형식으로 올렸다면, Bokeh가 가지는 인터렉티브한 성질이 잘 드러나지 않았을 것니다.
때로는 이렇듯, 블로그 내용에 따라 업로드 형식을 달리할 필요가 있습니다. 이번 글에서는 지난 포스팅을 중심으로 업로드 양식에 대해 설명하려고 합니다.
1. ipynb md
저는 쥬피터 노트북을 이용해서 파이썬 언어로 작업을 하는 때가 많습니다. 이 경우, md 파일로 변환하는 것은 매우 쉽습니다.
File Download as markdown을 통해서 전체 내용을 모두 마크다운 형태로 변환이 가능합니다. ipynb에서 생성된 모든 이미지도 함께 저장이 됩니다.
다만, Bokeh에서 notebook 안에 생성한 인터렉티브 자료들은 사라집니다. 따라서 이를 위해서는 다른 방법이 필요합니다.
2. see the HTML code of plots
제가 선택한 방법은 HTML을 이용하는 것이었습니다. 이를 위해서 output_file()을 사용해서 원하는 인터렉티브 자료를 html로 저장합니다. 방법은 아래와 같습니다.
1
2
3
from bokeh.io import output_file, reset_output
reset_output()
output_file("UserFile.html")
위의 코드를 실행하면 자동으로 새로운 탭이 생성되면서 만들었던 인터렉티브 앱이 작동함을 확인할 수 있습니다. 따라서 해당 HTML의 코드를 깃헙 페이지에 올리기만 하면 원하는 형태로 블로그 포스팅을 할 수 있게 됩니다.
HTML 코드를 살피는 방법은 여러가지가 있겠지만, 저는 github page에 html을 업로드함으로써 코드를 확인합니다. 그 뒤에 코드를 전부 복사하여 원하는 페이지에 붙여넣기를 합니다.
아래에 예시를 첨부하였습니다. pie chart와 함께 Bokeh의 가장 대표적인 예시이기도합니다.