.

.
List Of map with direction code in php & mysql

List Of map with direction code in php & mysql

01:22
Firstly create a table on database Like 'sanilotion' is my database and 'location' is my table.
create table like 'location'









create page like 'storelocation.php'
<?php
// include your congig file
include("includes/configuration.php");
include("includes/header.php");   
?>
<?php
 // form when isset found
if($_REQUEST['s']!='')
{
 $keyword1=$_REQUEST['s'];
 $keyword=str_replace(' ', '',$_REQUEST['s']);
 //this url used for getting lattitude ,longitude or all data in json form
 $url2="http://maps.googleapis.com/maps/api/geocode/json?address=".$keyword."&sensor=false";
   $details2=file_get_contents($url2); // get data from url in json by file_get_contents() function
    $result2 = json_decode($details2,true);
    //print_r($result2); you can check it

//it give us all information of searching pincode
$lat2=$result2['results'][0]['geometry']['location']['lat'];

$lng2=$result2['results'][0]['geometry']['location']['lng'];
   
 $address2=$result2['results'][0]['formatted_address'];
   
$key=substr($keyword,0,1); // used for like similar search pincode starting by first character



/*
//Query with show calculate distance between two la & long points
$sql=set @orig_lat=122.4058; set @orig_lon=37.7907;set @dist=10;

SELECT *,3956 * 2 * ASIN(SQRT( POWER(SIN((@orig_lat - abs(lat)) * pi()/180 / 2),2) + COS(@orig_lat * pi()/180 ) * COS(abs
(lat) *  pi()/180) * POWER(SIN((@orig_lon -lng) *  pi()/180 / 2), 2) )) as distance FROM location ORDER BY distance limit 10;

*/



// query for fetching data order by distance

$sql=mysql_query("SELECT * , 3956 *2 * ASIN( SQRT( POWER( SIN( (".$lat2." - ABS(lat) ) * PI( ) /180 /2 ) , 2 ) + COS(".$lat2." * PI( ) /180 ) * COS( ABS(lat) * PI() /180 ) * POWER( SIN( (
(".$lng2.") - lng) * PI() /180/2 ) , 2 ) ) ) AS distance
FROM location
WHERE  `pincode` LIKE  '".$key."%'
OR  `address` LIKE  '%".$keyword1."%'
ORDER BY distance ASC
LIMIT 10");
/*$sql=mysql_query("select * from location where `pincode` LIKE '".$key."%' OR `address` LIKE '%".$keyword1."%' order by pincode,lat,lng Asc");*/
  $numrows=mysql_num_rows($sql);

}


 ?>



   
   <?php
   // calculate distance between two latitude & longitude points
   
    function distance($lat1, $lon1, $lat2, $lon2, $unit) {

  $theta = $lon1 - $lon2;

  $dist = sin(deg2rad($lat1)) * sin(deg2rad($lat2)) +  cos(deg2rad($lat1)) * cos(deg2rad($lat2)) * cos(deg2rad($theta));

  $dist = acos($dist);

  $dist = rad2deg($dist);

  $miles = $dist * 60 * 1.1515;

  $unit = strtoupper($unit);



  if ($unit == "K") {

    return ($miles * 1.609344);

  } else if ($unit == "N") {

      return ($miles * 0.8684);

    } else {

        return $miles;

      }

}



//echo distance(32.9697, -96.80322, 29.46786, -98.53506, "M") . " Miles<br>";

//echo distance(32.9697, -96.80322, 29.46786, -98.53506, "K") . " Kilometers<br>";

//echo distance(32.9697, -96.80322, 29.46786, -98.53506, "N") . " Nautical Miles<br>";


//echo distance(28.6077,77.2992,28.6077,77.2992, "K") . "Kilometers <br>";

?>

<script src="http://maps.googleapis.com/maps/api/js"></script>


<div class="contentArea">

     <div class="divPanel notop page-content divPanel-1">
    









<div style="width:100%;background:#009933;color:#FFFFFF;border:2px solid #005300;padding-left:5px;float:left;">
<div><h2 style="font-weight:bold;font-size:36px;">Search Your Stores</h2></div>

<form name="" method="get" action="<?php echo URL;?>/storelocation.php">
<div style="float:left"><input type="text" name="s" placeholder="Address,Postal Code" value="<?php echo $_REQUEST['s'];?>"></div>
<div style="float:left;margin-left:10px;"><input type="submit" name="search" value="Found" style="height:30px;border-radius:2px;"></div>

</form>
</div>


<div style="width:100%;float:left;background-color:#FFFFFF;">
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
<div style="width:100%;margin-top:20px;padding-top:3px;border:1px solid #009933;">
 <?php
//echo $numrows;
 if($numrows>0)
  {
  while($res=mysql_fetch_array($sql))
  {
 //print_r($res);?>


<div style="width:100%;border-bottom:1px solid #009933; margin:10px;float:left;padding-top:5px;">
<div style="width:40%;float:left;">
<script>
var myCenter<?php echo $res['id']; ?>=new google.maps.LatLng(<?php echo $res['lat'];?>,<?php echo $res['lng'];?>);

function initialize<?php echo $res['id']; ?>()
{
var mapProp<?php echo $res['id']; ?> = {
  center:myCenter<?php echo $res['id']; ?>,
  zoom:5,
  mapTypeId:google.maps.MapTypeId.ROADMAP
  };

var map<?php echo $res['id']; ?>=new google.maps.Map(document.getElementById("googleMap<?php echo $res['id']; ?>"),mapProp<?php echo $res['id']; ?>);
//set your image url or image as marker
var iconBase = '<?php echo URL;?>/images/';
var marker<?php echo $res['id']; ?>=new google.maps.Marker({
  position:myCenter<?php echo $res['id']; ?>,
  icon: iconBase + 'sanimap.jpg'
  });

marker<?php echo $res['id']; ?>.setMap(map<?php echo $res['id']; ?>);

/*var infowindow<?php //echo $res['id']; ?> = new google.maps.InfoWindow({
  content:"<strong><?php //echo $res['name'];?></strong>"
  });*/

infowindow<?php echo $res['id']; ?>.open(map<?php echo $res['id']; ?>,marker<?php echo $res['id']; ?>);
}

google.maps.event.addDomListener(window, 'load', initialize<?php echo $res['id']; ?>);
</script>


<a href="https://www.google.com/maps?q=<?php echo $res['address'];?>" target="_blank">
<div id="googleMap<?php echo $res['id']; ?>" style="width:350px;height:200px;border:2px solid #006633;"></div></a>
</div>
<div style="width:60%;float:left;">
<h3 style="color:#006633;"> <?php echo $res['name'];?></h3>

<p><?php echo $res['address'];?></p>
<hr>
<div style="width:100%;float:left;">
<div style="width:50%;float:left;">

<p>Distance : <?php  $dist= distance($res['lat'],$res['lng'],$lat2,$lng2,'K');
echo substr($dist,0,5).' '.'Kilometers'; ?></p>
<p>Phone : <?php echo $res['type'];?></p>
<?php /*?><p><a href="https://www.google.com/maps?q=<?php echo $res['address'];?>" target="_blank">Get Direction</a></p><?php */?>
</div>
<div style="width:50%;float:left;">
<p>Store hours: <?php echo $res['storehours'];?></p>
<p>Timing: <?php echo $res['timing'];?></p>

</div>
</div>


<p><a href="<?php echo URL;?>/getdirection.php?id=<?php echo base64_encode($res['id']);?>&search=<?php echo $keyword;?>" target="_blank">Get Direction</a></p>


</div>

</div>

<?php }}?>

<?php if($numrows=='0'){
?>
<div style="width:100%;border:2px solid #CCCCCC; margin-bottom:10px;float:left;color:#FF0000;font-weight:bold;font-size:24px;padding:10px;"><strong>Sorry, No Record Found</strong></div>
<?php }?>
</div>
</div>
</div>

</div>
</div>
</div>
<div style="clear:both"></div>

by getting direction i also create new page  getdirection.php

<?php
include("includes/configuration.php");

include("includes/header.php");   

$locid = base64_decode($_REQUEST['id']);
$keysearch=$_REQUEST['search'];
$sql=mysql_query("select * from location where `id`='".$locid."'");
 $numrows=mysql_num_rows($sql);

$res=mysql_fetch_array($sql);
 $destination=str_replace(' ','%',$res['address']); // % takes because it takes space as %
?>


<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>






        <div style="width:95%;margin:0 auto;">
      
       
        <?php
        // get content or json code vy url or using file_get_content by curl
        //$url2="https://maps.googleapis.com/maps/api/directions/json?origin=".$keysearch."&destination=".$res['address']."&key=AIzaSyAUJ8o7-NyCWwfhDxJblMEKqBvSluXSsyE&sensor=true";
$url2="https://maps.googleapis.com/maps/api/directions/json?origin='.$keysearch.'&destination=$destination&key=AIzaSyAUJ8o7-NyCWwfhDxJblMEKqBvSluXSsyE&sensor=true";
         $details2=file_get_contents($url2);
    $result2 = json_decode($details2,true);
   
    //print_r($result2);
   
    $result3=$result2['routes'][0]['start_address'];
    ?>
   <!--<pre>-->
    <?php
    //print_r($result2['routes'][0]['legs'][0]);
   
    ?>
   
 <!--</pre>-->
    <?php
     $distance =$result2['routes'][0]['legs'][0]['distance']['text'];
   
     $duration =$result2['routes'][0]['legs'][0]['duration']['text'];
     $endaddress=$result2['routes'][0]['legs'][0]['end_address'];
   
     $endlat=$result2['routes'][0]['legs'][0]['end_location']['lat'];
   
     $endlng=$result2['routes'][0]['legs'][0]['end_location']['lng'];
   
  $startaddress=$result2['routes'][0]['legs'][0]['start_address'];

     $startlat=$result2['routes'][0]['legs'][0]['start_location']['lat'];
   
     $startlng=$result2['routes'][0]['legs'][0]['start_location']['lng'];
   
     $steps=$result2['routes'][0]['legs'][0]['steps'];

       
        ?>

<script type="text/javascript">
var Center = new google.maps.LatLng(<?php echo $res['lat']; ?>, <?php echo $res['lng']; ?>);
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var properties = {
    center: Center,
    zoom: 20,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  map = new google.maps.Map(document.getElementById("map"), properties);
  directionsDisplay.setMap(map);

  var marker = new google.maps.Marker({
    position: Center,
    /*animation: google.maps.Animation.BOUNCE,*/
  });

  marker.setMap(map);
  Route();
}

function Route() {

  var start = new google.maps.LatLng(<?php echo $startlat; ?>,<?php echo $startlng;?>);
  var end = new google.maps.LatLng(<?php echo $endlat;?>, <?php echo $endlng;?>);
  var request = {
    origin: start,
    destination: end,
    travelMode: google.maps.TravelMode.DRIVING
  };
  directionsService.route(request, function(result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(result);
    } else {
      alert("couldn't get directions:" + status);
    }
  });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="map" style="width:40%;height:300px;float:left;"></div>

<div style="width:50%;height:300px;float:left;margin-left:20px;font-size:12px;font-family:Roboto,Arial,sans-serif;font-weight:300;color:#2c2c2c;">

<table width="100%" cellspacing="2px">
<tr><td colspan="3" style="background-color:#eee;border:1px solid silver;margin:10px 0 0 10px;vertical-align: middle;padding-left:5px;">
<img src="http://mt.googleapis.com/vt/icon/name=icons/spotlight/spotlight-waypoint-a.png&text=A&psize=16&font=fonts/Roboto-Regular.ttf&color=ff333333&ax=44&ay=48&scale=1">&nbsp;&nbsp;<?php echo $startaddress; ?></td></tr>
<tr><td colspan="3">&nbsp;</td></tr>
<tr><td colspan="3"><?php echo $distance . ' about -' .$duration; ?></td></tr>
<?php
$count=1;
 for($i=0;$i<count($steps);$i++)
{?>
<tr>
<td><?php echo $count;?></td>
<td>
<?php echo $steps[$i]['html_instructions']; ?>
</td>
<td><?php echo $steps[$i]['distance']['text'];?></td>
</tr>
<?php
$count++;
}?>

<tr><td colspan="3">&nbsp;</td></tr>
<tr><td colspan="3" style="background-color:#eee;border:1px solid silver;margin:10px 0 0 10px;vertical-align: middle;padding-left:5px;">
<img src="http://mt.googleapis.com/vt/icon/name=icons/spotlight/spotlight-waypoint-b.png&text=B&psize=16&font=fonts/Roboto-Regular.ttf&color=ff333333&ax=44&ay=48&scale=1">&nbsp;&nbsp;<?php echo $endaddress; ?></td></tr>

</table>

</div>





 
</div>























bhbghjf


EmoticonEmoticon

Subscribe to: Post Comments (Atom)