こんかいGoogle APIを使用せずにQRコードを表示する必要があったのでメモ。
使用したライブラリ
■使い方
① canvasで表示したい。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
＜script＞ $(document).ready(function(){ $('#area1').empty(); $('#area1').qrcode({ width : 100, height : 100, text : 'http://bm-server.net/' }); }); ＜/script＞ // 描画エリア ＜div id="area1"＞＜/div＞ |
② imageで表示したい（印刷などするとき）
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
＜script＞ $(document).ready(function(){ $('#area1').empty(); $('#area1').qrcode({ width : 100, height : 100, text : 'http://bm-server.net/' }); $('canvas').attr('id', 'qrcode'); canvas = document.getElementById('qrcode'); url = canvas.toDataURL(); $("#area-img").attr('src', url); }); ＜/script＞ // 描画エリア ＜div id="area1" style="display:none"＞＜/div＞ ＜iv id="area2"＞＜img id="area-img" src=""＞＜/div＞ |
使用できる設定
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
// canvas or table render : "canvas", // 幅 width : 256, // 高さ height : 256, // 型番 typeNumber : -1, // 誤り訂正レベル L:1 M:0 Q:3 H:2 が設定可 correctLevel : QRErrorCorrectLevel.H, // 背景色 background : "#ffffff", // QRコードの色 foreground : "#000000" |
Comments are closed