2024
11
23
2010
08
18
Google Chart API で県庁所在地を散布図で表現する。
Google Chart API が面白い。散布図も作れるそうです。日本の県庁所在地の座標を変換して散布図に落とし込んでみました。ただし、沖縄は抜いています。
このデータの元とした県庁所在地の座標は、次の Google Spread Sheets から取得しました。
PR
2010/08/18 (Wed.) Trackback() Comment(0) Google Chart
2010
08
17
Google Chart API を利用して、QRコードを表示する。
Google Chart API を利用して、QRコードを表示します。
"qr.js"を呼び出す記述をしたところに、QRコードが現れます。
<script src="http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1282025622"></script>
ソースは、 http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1282025622
Google Chart API のQRコード表示は、チャートタイプ(Chart Type)のパラメータ「cht」に"qr"を指定し、QRコードのデータを「chl」パラ メータに指定することで行います。チャートサイズ(Chart Size)は、「chs」で指定します。つまり「http://chart.apis.google.com/chart? cht=qr&chs=150x150&chl=文字列」のように記載します。そうすると、文字列がQRコードに変換されて PNG画像が返ってきます。IMG要素のsrc 属性にこれを指定することで、これをページに表示することができます。
http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1282025622では、ページのURLを location.href で取得して、chlパラメータの値に入れています。
2010/08/17 (Tue.) Trackback() Comment(0) Google Chart
2010
08
10
Atom の日付書式は RFC3339準拠。
Atom の日付書式は 、次の3点を満たすこととされています。
１）[RFC3339]で定義される"date-time"形式に準拠させなければならない（MUST）。
２）日付と時間の区切り文字には大文字の"T"を用いなければならない（MUST）。
３）タイムゾーンオフセット定数を指定しないのであれば代わりに大文字の"Z"を記さなければならない（MUST）。
Google Data API は、Atom Publishing Protocol（AtomPub）に基づいているので、フィードの日付データは、この書式で返されます。Google Data APIでエントリの追加をする場合の日付も、これに従う必要があります。
そこで、JavaScript の Date コンストラクタ を拡張して、[RFC3339]書式で日付時刻を表す文字列を
返すメソッドを考えてみました。
「2010-08-10T06:33:25.123-09:00」のような文字列が返されます。
2010/08/10 (Tue.) Trackback() Comment(0) JavaScript
2010
08
04
Google カレンダーの一覧を allcalendars フィードで取得する。
Google Calendar API でいろいろな処理を行うには、まず処理するカレンダーの情報を取得する必要があります。自分のカレンダーとはいっても、追加したりしていると1つではありません。どのカレンダーを処理するのか明確にする必要があります。その際、自分のカレンダーの情報一覧を取得できると便利です。Google Calendar のフィードの種類は3つあります。メタフィード、allcalendarsフィード、owncalendars の3つです。
メタフィードは、read-only です。
■ http://www.google.com/calendar/feeds/default
allcalendars フィードは、google カレンダーにログインしていれば、次のURLで取得できます。自分のカレンダーのほかに、インポートした他人のカレンダーを含みます。色などの個人設定を変更できます。
■ http://www.google.com/calendar/feeds/default/allcalendars/full
owncalendars フィードは、google カレンダーにログインしていれば、次のURLで取得できます。自分のカレンダーのリストが表示されます。インポートした他人のカレンダーは含みません。エントリの追加変更ができます。
■ http://www.google.com/calendar/feeds/default/owncalendars/full
allcalendars フィードを JavaScript ライブラリを利用してHTMLに表示してみました。 そのページが、次のものです。
■ http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1280920541
これに利用しているメインの JavaScript は、次のファイルです。
■ http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1280920574
また、AuthSub による認証には、次のファイルを利用しています。
■ http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1280482679
今後、これらのスクリプトを応用して、エントリの追加を行うページを作るつもりです。
2010/08/04 (Wed.) Trackback() Comment(0) Google Calendar
2010
08
02
JSON のプロパティリストを表示する。
JSONP のフィードを扱おうとするとき、引数のオブジェクトの構造やプロパティ名を知らないとどうしようもありません。そこで、オブジェクトのプロパティをリスト化する関数を考案しました。それが、http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1280746218 に収めた createListOf関数です。オブジェクトを引数にとり、UL要素またはDL要素を返します。
この関数を使って、JSONP のフィードを調べるツールが、http://blog.cnobi.jp/v1/blog/user/c1c990de467ed4f31a60b43ae3632205/1280750100です。
これをHTMLに埋め込むと、下のように表示されます。
このブログでは、結果が見にくいので、お試しになる場合は、次のページ をご利用下さい。
■ 「listOf.js のお試しページ」
2010/08/02 (Mon.) Trackback() Comment(0) JavaScript
