Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

PHP - Google chart API - QR code margins not working (Bug or feature? )

I have a very simple function to generate QR code from the google chart API.

 function o99_qr_code($size,$type,$url ) {

        $qr = '';
        $dsize = $size .'x'.$size; // doubleSize

         $qr = '<img src="http://chart.apis.google.com/chart?cht=qr&chs=' . $dsize . '&chld=L|0&chl=' . $url . '" width="' .$size .'" height="'.$size .'" alt="QR code" title="QR Code for your mobile device"/>';

         switch ($type){
         case 'echo' :
         echo $qr;
         case 'return' :
         return $qr;
         }
    }

Now, this is working just fine except for the margin.

(Apologize for not linking a live URL - my DEV is on localmachine)

Whatver I try , I can not get the margin to go to 0. First I thought that for some reason, maybe the correction level L does not accept 0 margins - I tired &chld=M|1 and &chld=L|0 and &chld=M|3 , and even tried to change the order of the parameters and put &chld=L|0 to the end of the string or omitting it completely .

But for some reason, I always get the default margin of 4.

Am I doing something wrong ??

EDIT I - after request of URL : The generated URL is :

<img src="http://chart.apis.google.com/chart?cht=qr&chs=50x50&chld=L|0&chl=http://localhost/wp-sandbox/?p=6164" width="50" height="50" alt="QR code" title="QR code for your phone"/>

EDIT II

Check out this fiddle http://jsfiddle.net/obmerk99/rsjcM/

it demonstrate the problem .

like image 674
Obmerk Kronen Avatar asked Jul 06 '12 06:07

Obmerk Kronen


2 Answers

Google charts has a curious feature where it will grow the size of the image but not grow the size of the code.

This will depend on the size of the data within the code.

Take a look at these three examples

150 - no margin http://chart.apis.google.com/chart?cht=qr&chs=150x150&chld=L|0&chl=http://localhost/wp-sandbox/?p=6164

165 - margin http://chart.apis.google.com/chart?cht=qr&chs=165x165&chld=L|0&chl=http://localhost/wp-sandbox/?p=6164

180 - no margin http://chart.apis.google.com/chart?cht=qr&chs=180x180&chld=L|0&chl=http://localhost/wp-sandbox/?p=6164

Remember - you code needs a margin in order for the majority of devices to scan it properly.

like image 171
Terence Eden Avatar answered Oct 22 '22 09:10

Terence Eden


Same problems here with the Google API. So I ended up using this alternative service: http://api.qrserver.com/v1/create-qr-code/?data=http://www.google.com&size=104x104

The API (http://qrserver.com/api/documentation/create-qr-code/) offers better control of the desired QR Code image output.

like image 2
Mutual Exception Avatar answered Oct 22 '22 07:10

Mutual Exception