オープンソースのCDNを使って、WordPressの記事上でJavascriptを動かす(jsDelivr)

オープンソースのCDNであるjsDelivrがWordPressの記事上で動かしたいときにとても便利だったので備忘メモ https://www.jsdelivr.com 調べて、URLをコピーして、HTMLの中に書くだけ これで読み込める。 参考: Epochでリアルタイムグラフを描く リアルタイムグラフで遊ぶ(Epoch)

Epochでリアルタイムグラフを描く

Epochを使って、リアルタイムに動くグラフを描いてみる。 成果物はこちら リアルタイムグラフで遊ぶ(Epoch) Epochとは、チャートを描くツール https://epochjs.github.io/epoch/ 色々描けるが、今回は「Real-time Line」を使って、ドロップダウンリストで作成した式を即座に反映させて描くツールを作ってみる。 CDNからEpochの読込 WordPress上で動かすため、オープンソースのCDNからEpochを読み込む epoch-charting 必要なのは、 「epoch.min.css」「epoch.min.js」「tests.css」の三つ。 minではないjsとcssもあったが、とりあえず今回はminで良い 参考: オープンソースのCDNを使って、WordPressの記事上でJavascriptを動かす(jsDelivr) Epochの基本 基本は、横軸は時間として、yに好きな値を入れてpushする chartの変数に何が入っているかというと、 チャートをどのように描くか、データの中身(data変数で定義)などが入っている data変数の中には、このように定義されている 成果物はこちら リアルタイムグラフで遊ぶ(Epoch) フルコードは以下。かなり冗長になってしまった、、 成果物はこちら リアルタイムグラフで遊ぶ(Epoch)