How to Integrate Google Map using Gmaps JS?

By Hardik Savani November 5, 2023 Category : jQuery

Today, i am going to show you how to create simple google map in PHP. In this example i use gmaps.js plugin for integrate google map with marker of your location. You can simply generate google map in your any php framework like laravel framework, codeigniter framework, zend framework, cakephp framework etc.

Gmaps.js plugin provide us map events, markers, Geolocation, Geolocation etc. you can use very simply and use your project.

Bellow example you can see i added one marker on my location and also setted title, so you can also see demo and preview after bellow example file.

Preview:

Example:

Read Also: Laravel Collection map() Add Attribute Example
<!DOCTYPE html>
<html>
<head>
  <title>Google map integration in php example</title>
  <script src="http://maps.google.com/maps/api/js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/gmaps.js/0.4.24/gmaps.js"></script>

  <style type="text/css">
    #mymap {
      border:1px solid red;
      width: 800px;
      height: 500px;
    }
  </style>

</head>
<body>

  
  <h1>Google map integration in php example</h1>
  <div id="mymap"></div>

  <script type="text/javascript">

      
    var mymap = new GMaps({
      el: '#mymap',
      lat: 21.170240,
      lng: 72.831061,
      zoom:6
    });

    mymap.addMarker({
      lat: 21.170240,
      lng: 72.831061,
      title: 'Surat',
      click: function(e) {
        alert('This is surat, gujarat from India.');
      }
    });

  </script>

</body>
</html>

You can get more information about gmaps.js plugin from here : Gmaps JS.

Tags :
Previous

How to Get Current URL with Query String in Codeigniter?
Next

How to send mail using mailable in laravel 5.3?

We are Recommending you

Popular Posts

Categories

Latest Posts

Shares