PHP Classes

Leaflet PHP MySQL Map: Manage a Leaflet based map with locations in MySQL

Recommend this page to a friend!
  Info   View files Example   View files View files (32)   DownloadInstall with Composer Download .zip   Reputation   Support forum (2)   Blog    
Ratings Unique User Downloads Download Rankings
Not enough user ratingsTotal: 2,102 This week: 1All time: 1,858 This week: 89Up
Version License PHP version Categories
leafletmapportal 1.0.0Freeware5PHP 5, Databases, Content management, G..., A...
Description 

Author

This package can manage a Leaflet based map with locations in MySQL.

It manages information stored in MySQL database to be displayed on a map using the Leaflet library similar to Google maps.

Currently it can manage the information records of map areas, streets and companies.

Innovation Award
PHP Programming Innovation award nominee
June 2017
Number 6
Leaflet is a JavaScript library that can be used to render interactive maps on a Web page.

This package can manage maps from information stored in a MySQL database.

Manuel Lemos
Picture of Haseeb Ahmad Basil
  Performance   Level  
Name: Haseeb Ahmad Basil is available for providing paid consulting. Contact Haseeb Ahmad Basil .
Classes: 11 packages by
Country: Pakistan Pakistan
Age: 26
All time rank: 6147 in Pakistan Pakistan
Week rank: 45 Up1 in Pakistan Pakistan Up
Innovation award
Innovation award
Nominee: 4x

Winner: 1x

Example

<?php
 
require_once("db.php");
 
$companies = $conn->getCompaniesList();
 
$streets = $conn->getStreetsList();
 
$areas = $conn->getAreasList();
?>
<!DOCTYPE html>
<html>
<head>
 <title>Leaflet basic example</title>
 <script src="js/jquery.min.js"></script>
 <link rel="stylesheet" href="css/leaflet.css" />
 <script src="js/leaflet.js"></script>
</head>
<body>
<input type="text" name="search" id="search" /> <input type="button" id="searchBtn" value="Search" />

 <div id="map" style="width: 600px; height: 400px"></div>
 <div id="searchresult"></div>

 <script>

  var map = L.map('map').setView([51.505, -0.09], 13);

  L.tileLayer( 'https://api.mapbox.com/styles/v1/mapbox/streets-v10/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWVnYTYzODIiLCJhIjoiY2ozbXpsZHgxMDAzNjJxbndweDQ4am5mZyJ9.uHEjtQhnIuva7f6pAfrdTw', {
   maxZoom: 18,
   attribution: 'Map data &copy; <a href="http://openstreetmap.org/"> OpenStreetMap </a> contributors, ' +
    '<a href="http://creativecommons.org/"> CC-BY-SA </a>, ' +
    'Imagery ? <a href="http://mapbox.com">Mapbox</a>',
   id: 'examples.map-i875mjb7'
  }).addTo(map);
 
  $( document ).ready(function() {
    $('#searchBtn').click(function() {
      $.ajax({
        type: "GET",
        url: "ajax.php?keyword="+$("#search").val()
      }).done(function( data )
      {
        var jsonData = JSON.parse(data);
        var jsonLength = jsonData.results.length;
        var html = "<ul>";
        for (var i = 0; i < jsonLength; i++) {
          var result = jsonData.results[i];
          html += '<li data-lat="' + result.latitude + '" data-lng="' + result.longitude + '" class="searchResultElement">' + result.name + '</li>';
        }
        html += '</ul>';
        $('#searchresult').html(html);
        $( 'li.searchResultElement' ).click( function() {
          var lat = $(this).attr( "data-lat" );
          var lng = $(this).attr( "data-lng" );
          map.panTo( [lat,lng] );
        });
      });
    });
   addCompanies();
   addStreets();
   addAreas();
  });
 
  function addCompanies() {
   for(var i=0; i<companies.length; i++) {
    var marker = L.marker( [companies[i]['latitude'], companies[i]['longitude']]).addTo(map);
    marker.bindPopup( "<b>" + companies[i]['company']+"</b><br>Details:" + companies[i]['details'] + "<br />Telephone: " + companies[i]['telephone']);
   }
  }
 
  function stringToGeoPoints( geo ) {
   var linesPin = geo.split(",");

   var linesLat = new Array();
   var linesLng = new Array();

   for(i=0; i < linesPin.length; i++) {
    if(i % 2) {
     linesLat.push(linesPin[i]);
    }else{
     linesLng.push(linesPin[i]);
    }
   }

   var latLngLine = new Array();

   for(i=0; i<linesLng.length;i++) {
    latLngLine.push( L.latLng( linesLat[i], linesLng[i]));
   }
  
   return latLngLine;
  }
 
  function addAreas() {
   for(var i=0; i < areas.length; i++) {
       console.log(areas[i]['geolocations']);
    var polygon = L.polygon( stringToGeoPoints(areas[i]['geolocations']), { color: 'blue'}).addTo(map);
    polygon.bindPopup( "<b>" + areas[i]['name']);
   }
  }
 
  function addStreets() {
   for(var i=0; i < streets.length; i++) {
    var polyline = L.polyline( stringToGeoPoints(streets[i]['geolocations']), { color: 'red'}).addTo(map);
    polyline.bindPopup( "<b>" + streets[i]['name']);
   }
  }
 
  var companies = JSON.parse( '<?php echo json_encode($companies) ?>' );
  var streets = JSON.parse( '<?php echo json_encode($streets) ?>' );
  var areas = JSON.parse( '<?php echo json_encode($areas) ?>' );
 </script>
</body>
</html>


  Files folder image Files  
File Role Description
Files folder imagecss (1 file)
Files folder imagejs (3 files, 1 directory)
Accessible without login Plain text file addarea.php Aux. Auxiliary script
Accessible without login Plain text file addareadb.php Example Example
Accessible without login Plain text file addcompany.php Aux. Auxiliary script
Accessible without login Plain text file addcompanydb.php Example Example
Accessible without login Plain text file addstreet.php Aux. Auxiliary script
Accessible without login Plain text file addstreetdb.php Example Example
Accessible without login Plain text file ajax.php Example Search results via AJAX
Accessible without login Plain text file config.php Conf. Configuration script
Plain text file db.php Class Class source
Accessible without login Plain text file db.sql Data Auxiliary data
Accessible without login Plain text file deletearea.php Example Example
Accessible without login Plain text file deleteareadb.php Example Example
Accessible without login Plain text file deletecompany.php Example Example
Accessible without login Plain text file deletecompanydb.php Example Example
Accessible without login Plain text file deletestreet.php Example Example
Accessible without login Plain text file deletestreetdb.php Example Example
Accessible without login Plain text file editarea.php Example Example
Accessible without login Plain text file editcompany.php Example Example
Accessible without login Plain text file editstreet.php Example Example
Accessible without login Plain text file index.php Example Example
Accessible without login Plain text file updatearea.php Example Example
Accessible without login Plain text file updatecompany.php Example Example
Accessible without login Plain text file updatestreet.php Example Example

  Files folder image Files  /  css  
File Role Description
  Accessible without login Plain text file leaflet.css Data Auxiliary data

  Files folder image Files  /  js  
File Role Description
Files folder imageimages (5 files)
  Accessible without login Plain text file jquery.min.js Data Auxiliary data
  Accessible without login Plain text file leaflet-src.js Data Auxiliary data
  Accessible without login Plain text file leaflet.js Data Auxiliary data

  Files folder image Files  /  js  /  images  
File Role Description
  Accessible without login Image file layers-2x.png Icon Icon image
  Accessible without login Image file layers.png Icon Icon image
  Accessible without login Image file marker-icon-2x.png Icon Icon image
  Accessible without login Image file marker-icon.png Icon Icon image
  Accessible without login Image file marker-shadow.png Icon Icon image

 Version Control Unique User Downloads Download Rankings  
 100%
Total:2,102
This week:1
All time:1,858
This week:89Up