简体   繁体   English

Google Maps Store Locator

[英]Google Maps Store Locator

I am fairly new to Google maps API v3. 我是Google Maps API v3的新手。 I followed the tutorial on how to make a store locator and everything worked smoothly. 我按照有关如何进行商店定位的教程进行了学习,一切工作都顺利进行。 However, I am not familiar with phpMyAdmin and I cannot think of how I can make, instead of searching the store it searches a number of stores inventories and returns the store with that item in stock. 但是,我对phpMyAdmin并不熟悉,我想不出如何做,而不是搜索商店,而是搜索许多商店库存并退还带有该物品的商店。

My code is as follows: 我的代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

    <title>Google Maps AJAX + mySQL/PHP Example</title>

    <script src="http://maps.google.com/maps/api/js?sensor=false"

            type="text/javascript"></script>

    <script type="text/javascript">

    //<![CDATA[

    var map;

    var markers = [];

    var infoWindow;

    var locationSelect;



    function load() {

      map = new google.maps.Map(document.getElementById("map"), {

        center: new google.maps.LatLng(40, -100),

        zoom: 4,

        mapTypeId: 'roadmap',

        mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}

      });

      infoWindow = new google.maps.InfoWindow();



      locationSelect = document.getElementById("locationSelect");

      locationSelect.onchange = function() {

        var markerNum = locationSelect.options[locationSelect.selectedIndex].value;

        if (markerNum != "none"){

          google.maps.event.trigger(markers[markerNum], 'click');

        }

      };

   }



   function searchLocations() {

     var address = document.getElementById("addressInput").value;

     var geocoder = new google.maps.Geocoder();

     geocoder.geocode({address: address}, function(results, status) {

       if (status == google.maps.GeocoderStatus.OK) {

        searchLocationsNear(results[0].geometry.location);

       } else {

         alert(address + ' not found');

       }

     });

   }



   function clearLocations() {

     infoWindow.close();

     for (var i = 0; i < markers.length; i++) {

       markers[i].setMap(null);

     }

     markers.length = 0;



     locationSelect.innerHTML = "";

     var option = document.createElement("option");

     option.value = "none";

     option.innerHTML = "See all results:";

     locationSelect.appendChild(option);

   }



   function searchLocationsNear(center) {

     clearLocations(); 



     var radius = document.getElementById('radiusSelect').value;

     var searchUrl = 'phpsqlsearch_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;

     downloadUrl(searchUrl, function(data) {

       var xml = parseXml(data);

       var markerNodes = xml.documentElement.getElementsByTagName("marker");

       var bounds = new google.maps.LatLngBounds();

       for (var i = 0; i < markerNodes.length; i++) {

         var name = markerNodes[i].getAttribute("name");

         var address = markerNodes[i].getAttribute("address");

         var distance = parseFloat(markerNodes[i].getAttribute("distance"));

         var latlng = new google.maps.LatLng(

              parseFloat(markerNodes[i].getAttribute("lat")),

              parseFloat(markerNodes[i].getAttribute("lng")));



         createOption(name, distance, i);

         createMarker(latlng, name, address);

         bounds.extend(latlng);

       }

       map.fitBounds(bounds);

       locationSelect.style.visibility = "visible";

       locationSelect.onchange = function() {

         var markerNum = locationSelect.options[locationSelect.selectedIndex].value;

         google.maps.event.trigger(markers[markerNum], 'click');

       };

      });

    }



    function createMarker(latlng, name, address) {

      var html = "<b>" + name + "</b> <br/>" + address;

      var marker = new google.maps.Marker({

        map: map,

        position: latlng

      });

      google.maps.event.addListener(marker, 'click', function() {

        infoWindow.setContent(html);

        infoWindow.open(map, marker);

      });

      markers.push(marker);

    }



    function createOption(name, distance, num) {

      var option = document.createElement("option");

      option.value = num;

      option.innerHTML = name + "(" + distance.toFixed(1) + ")";

      locationSelect.appendChild(option);

    }



    function downloadUrl(url, callback) {

      var request = window.ActiveXObject ?

          new ActiveXObject('Microsoft.XMLHTTP') :

          new XMLHttpRequest;



      request.onreadystatechange = function() {

        if (request.readyState == 4) {

          request.onreadystatechange = doNothing;

          callback(request.responseText, request.status);

        }

      };



      request.open('GET', url, true);

      request.send(null);

    }



    function parseXml(str) {

      if (window.ActiveXObject) {

        var doc = new ActiveXObject('Microsoft.XMLDOM');

        doc.loadXML(str);

        return doc;

      } else if (window.DOMParser) {

        return (new DOMParser).parseFromString(str, 'text/xml');

      }

    }



    function doNothing() {}



    //]]>

  </script>

  </head>



  <body style="margin:0px; padding:0px;" onload="load()"> 

    <div>

     <input type="text" id="addressInput" size="10"/>

    <select id="radiusSelect">

      <option value="3" selected>3mi</option>

      <option value="5">5mi</option>

      <option value="10">10mi</option>

      <option value="25">25mi</option>

    </select>



    <input type="button" onclick="searchLocations();" value="Search"/>



    </div>

    <div><select id="locationSelect" style="width:500;visibility:hidden"></select></div>

    <div id="map" style="width: 500; height: 500"></div>

  </body>

</html>

And

<?php  
require("phpsqlsearch_dbinfo.php");

// Get parameters from URL
$center_lat = $_GET["lat"];
$center_lng = $_GET["lng"];
$radius = $_GET["radius"];

// Start XML file, create parent node
$dom = new DOMDocument("1.0");
$node = $dom->createElement("markers");
$parnode = $dom->appendChild($node);

// Opens a connection to a mySQL server
$connection=mysql_connect ('localhost', $username, $password);
if (!$connection) {
  die("Not connected : " . mysql_error());
}

// Set the active mySQL database
$db_selected = mysql_select_db($database, $connection);
if (!$db_selected) {
  die ("Can\'t use db : " . mysql_error());
}

// Search the rows in the markers table
$query = sprintf("SELECT address, name, lat, lng, ( 3959 * acos( cos( radians('%s') ) * cos( radians( lat ) ) * cos( radians( lng ) - radians('%s') ) + sin( radians('%s') ) * sin( radians( lat ) ) ) ) AS distance FROM markers HAVING distance < '%s' ORDER BY distance LIMIT 0 , 3",
  mysql_real_escape_string($center_lat),
  mysql_real_escape_string($center_lng),
  mysql_real_escape_string($center_lat),
  mysql_real_escape_string($radius));
$result = mysql_query($query);

if (!$result) {
  die("Invalid query: " . mysql_error());
}

header("Content-type: text/xml");

// Iterate through the rows, adding XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
  $node = $dom->createElement("marker");
  $newnode = $parnode->appendChild($node);
  $newnode->setAttribute("name", $row['name']);
  $newnode->setAttribute("address", $row['address']);
  $newnode->setAttribute("lat", $row['lat']);
  $newnode->setAttribute("lng", $row['lng']);
  $newnode->setAttribute("distance", $row['distance']);
}

echo $dom->saveXML();
?>

You would use a join in your query (though a View is likely better) to query against the store inventory. 您可以在查询中使用联接(尽管使用View可能更好),以针对商店库存进行查询。 So you would check to see that inventory is > 0. Your query would include something like FROM markers WHERE ( [your join query] and [inventory field] > 0) AND HAVING distance ... 因此,您将检查库存是否大于0。您的查询将包含FROM markers WHERE ( [您的 FROM markers WHERE ( 查询] and [库存字段] > 0) AND HAVING distance 相似性 ...

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM