エクセルのデータを可視化する案件についてChartJSやGoogleチャートを試しているうちに、集計の仕方やデータの見せ方など工夫すればいろいろ出来そうに思い、オープンデータの活用を考えてみることにしました。具体的に要望が上がってからの対応だと時間的な制約で余計なコストがかかったりしますので、ノウハウの蓄積を兼ねて実験的なものも含めていろいろ試してみようと思います。
当サイトのオープンデータのページ
Google Visualization のライブラリを使ってチャートとテーブルを表示しています。CSVデータは総務省で公開されているものを直接参照、と思ったのですがCORSの問題があって解決方法を考えていたところ、
利用者にやさしいCSVオープンデータの作り方、特選やまなしの食オープンデータ事例
こちらの記事に辿り着き、ひとまずCSVファイルを当サーバーに配置（UTF-8/LFに変換）して公開することにしました。
GoogleのChromeウェブストアチームから Chrome extension に関するアップデートのお知らせが届いていました。
詳細はこちら Manifest Version
記事によると、Chrome機能拡張を作る際はマニフェストに、
'manifest_version': 2:
と書きなさい、とのことです。
そして、これより前の Manifest version 1 は、今後リリース予定のChromeで動作しなくなります。
また、スケジュールに沿ってウェブストアのウォールやカテゴリからも削除されます。
このバージョン１と２の違いについて、上記ページにまとめられていて、
Browser action や Page action の各種プロパティが変更されているようです。
それと、セキュリティポリシー(CSP)の導入に伴って、HTMLとJSの分離が必要です。
CSPの詳しい記事はこちら Content Security Policy (CSP)
例えば “Inline JavaScript will not be executed” について。
<button onclick="clickHandler(this)">
HTML内に上記の記述があっても、デフォルトのポリシーでは動作しません。
この様な場合、HTML内にはボタンを配置しておいて、
<button>Click for awesomeness!</button>
ボタンクリックの処理についてはJS側でイベントリスナを登録します。
document.addEventListener('DOMContentLoaded', function () {
document.querySelector('button').addEventListener('click', clickHandler);
});
それと “Only local script and and object resources are loaded” の部分。
外部サイトのスクリプトを参照している場合は、デフォルトのポリシーのままでは動作しないので、
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
パッケージ内に組み込む必要があります。
<script src="jquery.min.js"></script>
あるいは “Relaxing the default policy” にあるようにCSPの設定を緩めるなど。
リリース済みパッケージのメンテナンスや今後のリリースの参考まで。
1月にChromeの文字化けについて記事を書きました。
その際に、Chrome機能拡張によって使用するフォントを固定してしまうという方法がウェブで見つかったので、それをヒントに自分でも機能拡張を作ってみました。