[jquery] Google Chart Tools の QR Code機能を使う

簡単に使えて便利な、Google Visualization API の Google Chart Tools: Infographics: QR Code をjQueryを活用して楽しく使う方法についての記事です。

パラメータを静的に与えれば済む場合は、このサイト ChartTool で作ると便利です。

動的に与えたい場合、foo=bar&buzz=123&...と長々と手動で書くのはしんどいですが、以下のように、jQuery.param() を活用すれば楽しく使えます。

相対プロトコル指定にしてあるので、httpsのページでもいい感じに対応できます。

$('body').append($('<img />', {
    width: 80,
    height: 80,
    src: '//chart.googleapis.com/chart?' + $.param({
        cht: 'qr',
        chs: '80x80',
        choe: 'Shift_JIS',
        chl: 'あなたの予想に反してこのQR Codeが読み取れますか？'
    })
}));

表示例 (外枠はBloggerの側のスタイルです)