php jquery page views unique visitors graph

you can use this simple script to add 100% accurate page views and unique visitors counter for your website. It's use php,mysql,JavaScript language and bootstrap,Raphael. js and Morris.js

MySQL database connection

You should add your database information and add this script in all other 3 script

<!--php $host="HOSTNAME";//add your database host name
  $user="DATABASE USERNAME";//add your database username
  $db="DATABASE NAME";//add your database name
  $pass="DATABASE PASSWORD";//add database password 
  $con=new mysqli($host,$user,$pass,$db);
  if($con--->connect_error) {  
  die("Connection failed: " . $con->connect_error);} 
?>

Create MySQL table

<!--php
/****** add mysql connection script here ******/

$sql="CREATE TABLE pv(id INT(6) UNSIGNED AUTO_INCREMENT PRIMARY KEY, 
pageview INT(20) NOT NULL,
cdate VARCHAR(30) NOT NULL,
uniquepageview INT(10))";
if ($con--->query($sql) === TRUE) {
echo "Table created successfully<br>";
} else {
echo "Error creating table: " . $con->error;
} 

Create php script to get page views,unique visitors and update database table

You have to add this php script on every pages.

       
<!--php

/****** add mysql connection script here ******/

$date=date('M/d');
$q='SELECT * FROM pv ORDER BY id DESC';
$result=$con--->query($q);
   if($result->num_rows > 0){
      $rpv = $result->fetch_assoc();
      if($rpv['cdate']==$date){
                   
      $pageview= $rpv['pageview']+1;        
   $q="UPDATE pv SET pageview='$pageview' WHERE cdate='$date'";    
      }else{ 
       $q="INSERT INTO pv (pageview,cdate) VALUES('1','$date')";    
      }
  
  }else{
      
       $q="INSERT INTO pv (pageview,cdate) VALUES('1','$date')";
   }
 $con->query($q);
 $ip=preg_replace('#[^0-9.]#','', getenv('REMOTE_ADDR'));
 $q="SELECT visitor FROM visitor WHERE visitor='$ip'";
 $result=$con->query($q);
   if($result->num_rows==0){
      $q='SELECT * FROM pv ORDER BY id DESC';
$result=$con->query($q);
   if($result->num_rows > 0){ 
         $rpv = $result->fetch_assoc();
      if($rpv['cdate']==$date){
      $uniquepageview= $rpv['uniquepageview']+1;        
   $q="UPDATE pv SET uniquepageview='$uniquepageview' WHERE cdate='$date'";    
      }else{
       $q="INSERT INTO pv (uniquepageview,cdate) VALUES('1','$date')";    
      }
    
   }else{
       $q="INSERT INTO pv (uniquepageview,cdate) VALUES('1','$date')";    
      } 
     $con->query($q);     
       
   $q="INSERT INTO visitor (visitor) VALUE('$ip')" ;
$con->query($q);   
   }

   ?>    
 

php script to show total page views and unique visitors with date

<!--php 
/****** add mysql connection script here ******/
?-->
<!---output--->
   <div id="pageview" style="height: 300px;"></div>
   <div id="unique-visitor" style="height: 300px;"></div>
<!--external js and css links -->   
 <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>       
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.0/morris.min.js" ></script>

 <script type='text/javascript'>
       $(function(){
/*****script for total page views graph *****/
  Morris.Line({
        element: 'pageview',
        data: [ <?php 
        include 'db.php';
        $q="SELECT pageview,cdate FROM pv ORDER BY id DESC LIMIT 0,30";
        $result = $con->query($q);
        while ($r = $result->fetch_assoc()) {
        $arr[]= " {d: '".$r['cdate']."', pageviews: ".$r['pageview']."}, ";}
$c=count($arr);
for($i=$c-1;$i>=0;$i--){
echo $arr[$i];
}

 ?>
      ],
        xkey: ['d'],
        ykeys: ['pageviews'],
        labels: ['pageviews'],
parseTime:false
      });

  /****script for unique visitors graph*****/
       Morris.Line({
        element: 'unique-visitor',
        data: [ <?php $q="SELECT uniquepageview,cdate FROM pv ORDER BY id DESC LIMIT 0,30";
        $result = $con->query($q);
        while ($r = $result->fetch_assoc()) {
        $arr2[]=" {d: '".$r['cdate']."', visitors: ".$r['uniquepageview']."}, ";} 
$c=count($arr2);
for($i=$c-1;$i>=0;$i--){
echo $arr2[$i];
}  ?>
       ],
        xkey: ['d'],
        ykeys: ['visitors'],
        labels: ['visitors'],
parseTime:false
      });
      
 });
</script>
  
          

Graph styles

 <style type="text/css">
            .morris-hover{position:absolute;
                         z-index:1000}
            .morris-hover.morris-default-style{
                border-radius:10px;
                padding:6px;
                color:#666;
                background:rgba(255,255,255,0.8);
                border:solid 2px rgba(230,230,230,0.8);
                font-family:sans-serif;
                font-size:12px;
                text-align:center
            }.morris-hover.morris-default-style .morris-hover-row-label{
                font-weight:bold;
                margin:0.25em 0
            }
.morris-hover.morris-default-style .morris-hover-point{white-space:nowrap;
                   margin:0.1em 0}

        </style>
          

you may like simple hit cunter without database