Advertisements

Google Chart API tools are the best tool to create various types of charts. You can create Pie Charts, Bar Charts, Box Charts, etc. with Google Chart API. The great thing is you can also create QR codes with your data using this tool. The process is simple to generate a QR code for the data you want. The full-form of QR code is Quick Response code. These days, the latest devices come in the market have preloaded QR code readers. So, just aim your QR code reader to the code and it will read its data. Here is the process to generate QR codes using Google Chart API tool.

qr-code-generator-google-charts-i10

Steps to Generate QR codes using Google Chart API:

The Google Chart API tool works on URL parameter. So, add your parameters in the URL and get the QR code. The full QR code parameters can be found here.

So, first, we will start by using the URL parameter to generate QR Code. Before starting the process, you will have to learn these required parameters.

Request URL: https://chart.googleapis.com/chart

Parameters:

cht=qr (Chart type, we will use QR)
chs=250×250 (QR code Width and Height)
chl=www.techlisten.com (The data we want to embed in the QR Code)
choe=UTF-8 (The Encoding Type)
Our final URL will be:

https://chart.googleapis.com/chart?cht=qr&chs=250×250&chl=www.techlisten.com&choe=UTF-8

It will generate this QR Code:

The above method works good if you want to generate few QR Codes. But, what if you want to generate many QR Codes? The answer is here. You can create a PHP-HTML form to send data to the request URL and get the result. To do so, first we will create a simple HTML form with any tool, like Notepad. I will use Dreamweaver in this tutorial. I will set the Width-Height to 250×250 and encoding to UTF-8. The HTML form code will look like this:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>QR Code Generator</title>
</head>

<body>
<form id=”form1″ name=”form1″ method=”post” action=”QRcodegenerate.php”>
<h1>QR Code Generator:</h1>
<p>
<input name=”cht” type=”hidden” value=”qr” />
<input name=”chs” type=”hidden” id=”chs” value=”250×250″ />
<label>Data:
<input name=”chl” type=”text” id=”chl” width=”300″ />
</label>
<input name=”choe” type=”hidden” id=”choe” value=”UTF-8″ />
</p>
<p>
<label>
<input name=”Submit” type=”submit” id=”Submit” value=”Generate QR Code” />
</label>
</p>
</form>
</body>
</html>

To process the above form, we will create a PHP file called QRcodegenerate.php with the below code:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>QR Code Generate !</title>
</head>

<body>
<?php
// first we will collect the data
// and convert them into variables
$qcht = $_POST[‘cht’];
$qchs = $_POST[‘chs’];
$qchl = $_POST[‘chl’];
$qchoe = $_POST[‘choe’];

// Now we will get the output
echo “<img src=’https://chart.googleapis.com/chart?cht=$qcht&chs=$qchs&chl=”.urlencode($qchl).”&choe=$qchoe’ alt=’QRCode’ />”;
?>

</body>
</html>

iebtv9siaf2dixhgud4yaknkkddoytuzsqfe46siwbm

Everything is done! Now upload both of these files to your server and start creating QR Codes !! Share your opinions about this tutorial in the comments !!

Enter your email address:

Delivered by Alphabet

Advertisements