Create Dynamic Time User Graph using Google Charts – A Practical Tutorial

Chart Error

In my last post, we have studied the basics of Google Chart. Google Charts helps us display the dry-data in a very beautiful visualization.

If you look around the web, you’ll find that there is a lot of buzz about Google charts but there are not many tutorials which demonstrate how to  use Google Charts. So I came up with this tutorial.

In this tutorial I will share how to create time user graph using Google Charts , PHP and MYSQL.  Here are the steps :

  1. Load the Google Charts AJAX api: jsapi .
  2. Load the Visualization API Library and add package name corechart.
  3. Then, set google callback function and call `getData()` function which will fetch data from the database.
  4. In the getData() function, we will retrieve an array of data and will push the data in the drawChart() method.
  5. In the drawChart() method, we will push the array data to tables and will draw line chart with the data.

For this tutorial we will be using a DB table as a data source. The table contains users and their date of registration.  Here, we will display the number of registered users on a particular date.  Lets start with the tuorial:

Continue Reading

How to crop an image using PHP and JQuery

Crop Image


The most common requirement over the modern web applications is upload image, crop as required or resize it, whether for profile picture use or any other use in photo galleries (small and bigger image) or as thumbnails. This post is going to be very interesting for the beginners who haven’t played with images for web applications and others can use this as a reference for the awesome web applications. We will cover all the basic requirement and we have also provided the source code for direct view of the output which you can use in every day situations. A small definition of cropping from Wikipedia:

Cropping refers to the removal of the outer parts of an image to improve framing, accentuate subject matter or change aspect ratio.

The Concept

Before we begin, I will briefly discuss the concept behind cropping an Image.

We will use a combination of Jquery and PHP to achieve our goal. More specifically we will utilize the imgAreaSelect jQuery plugin. We will also utilize Image functions specific to PHP.

Here is what we will be doing

  1.  Allow a user to make a selection by dragging over the Image. We also have a Preview Panel which lets user view the selection in real -time
  2. Hold the Coordinates of the selection in hidden Form Fields. We will utilize the onSelectEnd callback function. The onSelectEnd callback is fired as soon as a user finishes making the selection.
  3. Post selection coordinates to the crop.php file. The crop.php file will be responsible for final cropping of the image. We will utilize imagecreatetruecolor, imagecreatefromjpeg , imagecopyresampled and imagejpeg functions to actually crop the image
  4. Finally we will display the cropped image.

Note: We assume that you have basic PHP programming knowledge, and your server is up and running. We are also assuming that you have knowledge of how to upload image using PHP.Continue Reading

How to Import CSV to MySQL database with PHP

CSV files, commonly known as Excel (.xls) files, are used as spread sheets to store information in a tabular manner. Modern CSV handlers are capable of most of the functions — like calculating sum, average, median to making graphs, charts and tables. But, at times we may need to store the data in SQL format to be parsed easily, or for secure storage. SQL is not doubt the best medium for such kind of jobs. But typing or even copy-pasting each data to SQL is a tiresome job.

This is where PHP comes in action. It has the ability to parse CSV files, which allows us to do further processing. Let us see how to import the CSV to MySQL database using PHP.Continue Reading