【ホームページ作成】Google Chart APIでQRコードを作成する方法

2次元コード「QRコード」を簡単に作る

 

携帯端末向けにURLやメールアドレスなどを伝える用途として、2次元コード「QRコード」がよく利用されています。 QRコードというのは、右図のようなものです。
※QRコードは(株)デンソーウェーブの登録商標です。（使用に対するライセンスは不要で、自由に作成・活用できます。）

QRコードには、URLなどのアドレスだけでなく、何でも任意の文章を含めることができます。 例えば右図のQRコードを読み取ると、「いつも記事をご覧頂き、ありがとうございます。」という日本語の文章が表示されます。

QRコードを無料で作成できるサービスはたくさんありますが、今回は、「Google Chart API」というAPIを使ってQRコードを作成する方法をご紹介いたします。

Google Chart APIのQRコード作成機能

Google Chart APIでは、以前の記事「円グラフをウェブ上で簡単に表示させる方法」でご紹介したように、様々なグラフを簡単に作成できます。 その機能の中に「QRコード作成機能」も含まれています。

Google Chart APIを使ってQRコードを作成する方法だと、面倒な（生成された画像を保存してから自分のサーバにUPするような）手間は不要です。 Google Chart APIを呼び出すURLを作り、それをimg要素を使ってウェブページに貼り付けるだけで、QRコードの画像を表示させられます。

例えば、All Aboutのトップページ「http://allabout.co.jp/」をQRコードにしたい場合は、以下のような「Google Chart APIを呼び出すURL」を作成します。

http://chart.apis.google.com/chart?chs=150x150&cht=qr&chl=http://allabout.co.jp/

このURLをimg要素のsrc属性に書き、以下のようなHTMLソースを作ります。

<img src="http://chart.apis.google.com/chart?chs=150x150&cht=qr&chl=http://allabout.co.jp/" width="150" height="150" alt="QRコード">

このソースを表示させれば、QRコードが表示されます。
QRコードの画像を保存したり、アップロードしたりする必要はありません。
そのため、QRコードの中身を修正したくなった場合でも、HTMLソースを修正するだけで済むので面倒がありません。
※画像を作り直して再度アップロードし直すような作業が不要です。

上記のソースを表示すると、以下のように見えます。

今回は、上記のように「Google Chart API」を使って、簡単にQRコードを作成する方法をご紹介いたします。
上記の例のように、「URLだけを含めたQRコード」を作る場合は、上記に書いたソースがほぼすべてです。 しかし、QRコード内に日本語文字や空白文字などを含めたい場合には、もう少し作業が必要です。
詳しい作成方法は、次のページからご紹介いたします。