QR Codes with Google Charts API

I'm a big fan of the google charts API - it draws much better-looking graphs than I would ever manage and all I have to do is assemble the right URL to make it work. I recently got a feature request to add QR codes to joind.in, so that speakers and event admins could easily allow people to link in to a particular talk page.

To cut a long story short, joind.in already has short urls for particular talks, just in the form http://joind.in/[talk_id] so I created the QR codes to point to these. The URL looks like this:

http://chart.apis.google.com/chart?chs=400x400&cht=qr&chl=http%3A%2F%2Fjoind.in%2F%2F3338

The parameters, in turn, are the chart size, the chart type, and the URL to link to - The image ends up looking like this:

Absolutely simple when you know how - thanks Google Charts :)

7 thoughts on “QR Codes with Google Charts API

    • Actually the feature has been there for a few weeks, but this post sat in draft for a little while. Glad you like it, thanks for commenting :)

  1. Hey Lorna,

    I've rolled QR codes into the re-write I'm doing to CCHits.net, but I'm using a local library from http://sourceforge.net/projects/phpqrcode/. Here's (loosely) how I'm using it:

    <?php
    $url = 'http://www.example.com&#039;;
    $localfilename = 'qrcode.www.example.com.png';
    if (! file_exists(dirname(__FILE__) . '/' . $localfilename) {
    include_once '/path/to/libs/phpqrcode.php';
    QRcode::png($url, dirname(__FILE__) . '/' . $localfilename, 'M', 2, 1);
    }
    echo "Click here to visit $url";

    • Curses, the HTML (just the img tag) was stripped out of that comment.

      So, that should have read:
      echo "<p><img src=\"$localfilename\" alt=\"QRCode for $url\"><br />Click here to visit $url</p>";

      • Jon, it was faster for me to write this code than find a library - mostly because I do so much with google's services that I started playing and had it working before I thought about wrapping it. I'm seeing QR codes popping up all over the place these days (even in women's magazines, although the explanations of what they are there are pretty hilarious). Thanks for sharing your code and use of the QR codes :)

  2. And it's not limited to GET-Requests!
    Using POST you can even create QR-Codes containing nearly anything. From a hyperlink through a mailto:-link up to V-Cards and Calendar-Events.

    Nice feature I stumbled over just today.

Leave a Reply

Please use [code] and [/code] around any source code you wish to share.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>