えいのうにっき

誤字脱字・記述の誤りなどはこちら https://github.com/a-know/blog.a-know.me へお願いします

草グラフを iframe タグで簡単に埋め込む(Pixela v1.12.1)

以前に、以下のような記事を書きました。

blog.a-know.me

これでもまぁ便利なのですが、コピペでいいとはいえちょっとしたコードを埋め込まなければいけなかったり、そもそもはてなブログ以外のブログではどうやればいいのよ、といった、ビギナーにはちょっと難しめなところがありました。

これが、今日実施した Pixela のアップデート( Release v1.12.1 · a-know/Pixela · GitHub )により、以下のような iframe タグで簡単に埋め込めるようになりました。

<iframe src="https://pixe.la/v1/users/a-know/graphs/test-graph.html?mode=simple" height="155" width="720" frameborder="0"></iframe>

このタグを実際に埋め込んでみると↓こんなかんじで表示されます。これは、このブログのPV数を草グラフにしているものですね。

↑のグラフにマウスオーバーしてもらうとわかると思うのですが、iframeのタグで埋め込むだけで、ツールチップの表示までできちゃいます。simple-short と指定してもらえれば、shortモードでの表示も可能です。

これで、ブログのみならず esa などの Wiki にもツールチップ付きで簡単に埋め込められるようになったと思います(iframeの埋め込みが拒否されていない場合のみですが)。ぜひご活用ください!

合わせて読みたい