Google Chart APIでQRコード表示
2008.09.07 06:27:52 , Posted
2013.05.04 17:17:25 , Update by Gyokuei
PCから携帯用ページにとばす方法として一番視覚的にわかりやすいのがQRコードです。
QRページが作れるフリーソフトや、web上でフリーで作れるサイトはいっぱいありますが、
たとえば自分のサイトで、ページごとの携帯用サイトへのQRコードを動的に表示させたい、なんて場合、
これまでは
cgiやPHPのスクリプトを設置するのが一般的でした。
ところがコレ↑を設置しようと思ってググったところ
Googleが超便利サービスを開始していたのを発見。
Google Chartというのは、urlのうしろにいろんなパラメータをつけて画像として表示すると、グラフを吐き出すサービスです。
レーダーチャート、分布図、円グラフ、棒グラフ、折れ線グラフ、メーター表示、地図など種類豊富。
そのサービスに、2ヶ月ほど前にQRコードが加わっておりました。
http://chart.apis.google.com/chart?
のうしろに、パラメータをつけて渡します。パラメータは&で区切ります。
urlや日本語の文字列の場合、エンコードし、エンコードの種類を指定してください。
使用例
このページの携帯版のQRコードです。
<img src="http://chart.apis.google.com/chart?chs=150x150&cht=qr&chl=http%3a//gin.zarasu.com/m/index.php?animehack.jp/m/000551.html&choe=UTF-8">
グラフの大きさ:chs=150x150
グラフの種類:cht=qr
埋め込みたい文字列:chl=http%3a//gin.zarasu.com/m/index.php?animehack.jp/m/000551.html
文字列エンコードの種類:choe=UTF-8
サイト掲載時の注意
Google Chart APIの機能とは関係ありませんが、
QRコードのまわりが黒いと携帯で読み取りづらくなります。
黒っぽい背景のサイトでは、QRコードのまわりの白部分を大きめにとって表示すると吉。
参考にしたサイト
公式サイト
Google Chart API - Developer's Guide QR codes
Google Mania
たつをの ChangeLog
このページを読み返す