Python Plotlyで作成したチャートのブログ記事への埋め込み方法

Plotlyで作成したチャートをブログでシェアしたいと思うことも少なくないと思います。

そこで作成、出力したチャートのHTMLファイルをブログ記事に埋め込む方法を紹介します。

HTMLファイルの出力方法

念のためですが、Plotlyで作成したチャートをHTMLファイルとして保存する方法は以下の通りです。

fig_.write_html(r'hoge\hoge.html',include_plotlyjs='cdn',full_html=False) 
# hoge\hoge部分にファイルパスを指定

ブログ記事への埋め込み

埋め込み前にワードプレスのメディアライブラリに出力したチャートのHTMLファイルをアップロードし、ファイルのURLを記録しておいてください。

あとは、記事にカスタムHTML ブロックを追加し、下記のように入力するだけです。

<iframe src="アップロードしたファイルのURL" width="100%" height="600"></iframe>

widthとheightは指定しないとチャートがつぶれてしまってうまく表示されないため、指定する必要がありそうでう。
好みの値を入れて調整すればいいかと思います。

非常に短い内容ですが、以上のステップだけで簡単にPlotlyで作成したチャートの埋め込みは完了です。

Python インタラクティブ・データビジュアライゼーション入門 Plotly/Dashによるデータ可視化とWebアプリ構築 [ @driller ] 価格：4400円（税込、送料無料) (2022/7/10時点) 楽天で購入