CodePenでD3.jsのグラフを記載してみた
CodePen
はてなブログ上でJavaScriptをゴリゴリ動かすと、
意図しない動きをする場合があるかもしれないのでCodePenを利用してみました。
CodePen - Front End Developer Playground & Code Editor in the Browser
いままでローカルでAtomとChromeで試していたのですが、
CodePen上の編集も使いやすかったです。すぐ結果も出ますし、そのまま公開できますし。
よく考えたら、記事に埋め込む用のソースコードを作成していたのもナンセンスかもしれません。
CodePenの使い方はこちらを参考にしました。
【はてなブログ】CodePenをはてなに貼る方法 - のんびり猫プログラマの日常
作成したグラフ
前回のグラフと同じです。
See the Pen D3_LineChart by book_stone (@book_stone) on CodePen.
実行結果も見やすくなった気がします。
HTML、CSSおよびJavaScriptが分離されているのがいいですね。
ただペタッとコピペして使えないかもしれませんが。
次回は適当にグラフに数値を入れたりして遊んでみようと思います。
