node-webkitでGoogle Chartsが使えなかった件
おはようございます。最近、二男がお風呂も肩まで浸かろうとせず、よる遅くまで起きて、問題児化wして、反対に長男は魔の2歳児が落ち着き、どんどん手がかからなくなって助かっているkjunichiです。
//はもちろんダメ
数年前にGoogle流な書き方のsrc=//で始めるやつ、これはnode-webkitのindex.html付近だとNG。多分file://なHTMLを扱っているとみなされるから
onloadイベントよりまえに動かせば良さそう。
Jsdo.itでDOMContentLoadedのタイミングでgoogle.setOnLoadCallbackを呼び出したが、これはフツー動いた。
が、onloadでこれをやるとこれはフツーに動かない。
node-webkitだとGoogle Chartsが動かせない!?
DOMContentLoadedのコードを動かしたがダメだった。
d3.jsがあるじゃない
もともと、GoogleChartsのゲージでサーバーのCPU使用率を表示。ヌルヌル動くよ!を見て、Github製のエディタのAtomでも採用されているらしいnode-webkitでアプリとして実装出来そうだな、というところから始めたのですが、d3.jsのお勉強が始まり、よくよくググったら、google style gauges using javascript d3.jsにGaugeのd3.js実装があり、これで無事出来そうでした。
まとめ
- Webページのロードのされ方の理解が少し深まりました。
- d3.jsを今回は実用的にお勉強できた。
- もちろん、iframe越しでGoogle Chartsを使ったページなら問題なくnode-webkitで表示されます。
関連記事