Today I will explain, Google maps integration with codeigniter using Google maps library.

Now I had taken a open source Google maps library and placed it under codeigniter library folder and also added jsmin.php this library accepts a string as input and returns another string as output.

Now I will create a view file as maps.php which will display the Google maps.
For now I will show a small example to use googlemaps.php library to add marker to location.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <title>Google maps integration to Codeigniter Framework</title>    
<head><?php echo $map['js']; ?>

<style>
.googlemap
{
 background-color: aquamarine;
 alignment-adjust: central;
}
.tb10 {
	background-image:url(images/form_bg.jpg);
	background-repeat:repeat-x;
	border:1px solid #d1c7ac;
	width: 306px;
        height:30px;
	color:#333333;
	padding:3px;
	margin-right:4px;
	margin-bottom:8px;
	font-family:tahoma, arial, sans-serif;
}
input#submitbutton {
border:2px groove #7c93ba;
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding: 5px 25px;
/*give the background a gradient - see cssdemos.tupence.co.uk/gradients.htm for more info*/
background-color:#6b6dbb; /*required for browsers that don't support gradients*/
background: -webkit-gradient(linear, left top, left bottom, from(#88add7), to(#6b6dbb));
background: -webkit-linear-gradient(top, #88add7, #6b6dbb);
background: -moz-linear-gradient(top, #88add7, #6b6dbb);
background: -o-linear-gradient(top, #88add7, #6b6dbb);
background: linear-gradient(top, #88add7, #6b6dbb);
/*style to the text inside the button*/
font-family:Andika, Arial, sans-serif; /*Andkia is available at http://www.google.com/webfonts/specimen/Andika*/
color:#fff;
font-size:1.1em;
letter-spacing:.1em;
font-variant:small-caps;
/*give the corners a small curve*/
-webkit-border-radius: 0 15px 15px 0;
-moz-border-radius: 0 15px 15px 0;
border-radius: 0 15px 15px 0;
/*add a drop shadow to the button*/
-webkit-box-shadow: rgba(0, 0, 0, .75) 0 2px 6px;
-moz-box-shadow: rgba(0, 0, 0, .75) 0 2px 6px;
box-shadow: rgba(0, 0, 0, .75) 0 2px 6px;
}
/***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
input#submitbutton:hover, input#submitbutton:focus {
color:#edebda;
/*reduce the spread of the shadow to give a pushed effect*/
-webkit-box-shadow: rgba(0, 0, 0, .25) 0 1px 0px;
-moz-box-shadow: rgba(0, 0, 0, .25) 0 1px 0px;
box-shadow: rgba(0, 0, 0, .25) 0 1px 0px;
}
</style>

</head>
    
    
<body>
    <div class="googlemap">
    <h1>eKnowledgetree Programming Blog - For More Knowledge Please Visit @ <a href="https://www.eknowledgetree.com/" background-color="red">  
    eKnowledgeTree</a></h1>  
</div>
    <center>
    <form action="google" name="mapfrm" method="post">
    <input type="text" class='tb10' value="" id="mapposition" name="mapposition" placeholder='madhapur,hyderabad'></input>
    <input type="submit" name="submitbutton" id='submitbutton' value="Add Marker">
    </form></center>
    <br>    
    <?php echo $map['html']; ?>
</body>
</html>

Here in the above code I am sending location name to the controller function google().
Now we will use these lacation name and passed it into library function initialize()
To configure google map.

 <?php
 class Mapview extends CI_Controller
 {
     
        public function google()
	{
        $this->load->library('googlemaps');
	
	$config['center'] = $this->input->post('mapposition');
        $config['zoom'] = '15';
	$this->googlemaps->initialize($config);
	
	$marker = array();
	$marker['position'] = $this->input->post('mapposition');
        //$marker['position'] = 'india,hyderabad';
      
	$this->googlemaps->add_marker($marker);
	
	$data['map'] = $this->googlemaps->create_map();

        $this->load->view('demos/maps', $data);

   
	}
		
	}
    ?>

Here I also used library function add_ marker() to create marker in the Google maps.

Thanks for reading this article.
Live Demo
Download
[sdm_download_counter id=”84″]