Google Chart Tools で QRコードを動的に作成する方法

Pocket

Google Chart Tools の中に、QRコードを動的に生成するAPIがある。
特定のURLにGETリクエストを渡すだけでPNG画像を返してくれるので、非常に便利だ。

説明はAPIのリファレンス(英語)そのままだが、簡単に解説すると、

https://chart.googleapis.com/chart?cht=qr&chs=[size]&chl=[data]&choe=[output_encoding]&chld=[error_correction_level]|[margin]
の形式で、それぞれの引数に

  • [size]: 120x120 等の形式で、画像のサイズを指定。
  • [data]: URIエンコードした書き出しデータ。
  • [output_encoding]: 出力文字コード。UTF-8, Shift_JIS, ISO-8859-1 のいずれかだが、基本的に Shift_JIS でよい。
  • [error_correction_level]: 誤り補正の強さ。L, M, Q, H のいずれか。
  • [margin]: QRコードの余白ブロック数。規格的に4以上を設定する。省略時4。

のように設定すればよい。

いちいちURLをかくの面倒なので、簡単にURLが取得できるjavascriptをかいてみた。
テキストエリアにQRコードに変換したい文字列を入れ、スクロールバーでサイズを設定する。
※[9/19追記]IE8で動かない問題を修正しました。

できあがるQRコード(余白含む)よりも小さいサイズを指定すると、QRコードが表示されないので注意。
QRコードの仕様を読むと、どれだけの文字列でどのサイズになるかわかるはずなのだが、どうもGoogleの返す画像のサイズと一致しないので、画像サイズの自動チェックは諦めて、実際にスクロールバー動かしながら表示できるサイズを探す方法にした。

QR Code
↑試しにこのページのQRコードを作成してみると、こんな感じになる。

Google Chart Tools には、QRコード以外にも、数式やグラフを生成するAPIが公開されていて、どれもフリーで使用できるので、是非とも有効活用したいところ。

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください