简体   繁体   English

谷歌地图v3商店定位器

[英]google maps v3 store locator

I know, there are already lots of blogs for "store locator", but I couldn't find an answer. 我知道,已经有很多关于“商店定位器”的博客,但是我找不到答案。 I used the tutorial from https://developers.google.com/maps/articles/phpsqlsearch_v3 . 我使用了https://developers.google.com/maps/articles/phpsqlsearch_v3中的教程。 Things are not working, so does anybody have problems with that tutorial getting the store locator working? 一切都无法正常进行,那么该教程是否有让商店定位器正常工作的任何人? My problem is, that no valid xml-file is produced. 我的问题是,没有有效的xml文件产生。 I've changed the xml-output, because the original one did not work at all. 我更改了xml输出,因为原始的xml根本不起作用。 Here are the codes for the two files: 这是两个文件的代码:

Heading ##1. 标题## 1。 http://umwelt-und-information.com/maps/ASPE_Adressen_kodieren_2a.php http://umwelt-und-information.com/maps/ASPE_Adressen_kodieren_2a.php

<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>Example</title>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"
        type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map;
var markers = [];
var infoWindow;
var locationSelect;

function initialize() {
  map = new google.maps.Map(document.getElementById("map"), {
    center: new google.maps.LatLng(52, 8),
    zoom: 8,
    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 = 'ASPE_Adressen_kodieren_3a.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 nachname = markerNodes[i].getAttribute("Nachname");
     var strasse = markerNodes[i].getAttribute("strasse");
     var distance = parseFloat(markerNodes[i].getAttribute("distance"));
     var latlng = new google.maps.LatLng(
          parseFloat(markerNodes[i].getAttribute("lat")),
          parseFloat(markerNodes[i].getAttribute("lng")));

     createOption(nachname, distance, i);
     createMarker(latlng, nachname, strasse);
     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, nachname, strasse) {
  var html = "<b>" + nachname + "</b> <br/>" + strasse;
  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 = nachname + "(" + 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="initialize()">
<div>
 <input type="text" id="addressInput" size="10"/>
<select id="radiusSelect">
  <option value="25" selected>25mi</option>
  <option value="100">100mi</option>
  <option value="200">200mi</option>
</select>

<input type="button" onclick="searchLocations()" value="Search"/>
</div>
<div><select id="locationSelect" style="width:100%;visibility:hidden"></select></div>
<div id="map" style="width: 100%; height: 80%"></div>
</body>
</html>

Heading ## 2. http://umwelt-und-information.com/maps/ASPE_Adressen_kodieren_3a.php 标题## 2。http://umwelt-und-information.com/maps/ASPE_Adressen_kodieren_3a.php

<?php
error_reporting(E_ALL); 
require("dbpass.php");
if (PHP_VERSION>='5')
require_once('domxml-php4-to-php5.php');
// Get parameters from URL
$center_lat = $_GET['lat'];
$center_lng = $_GET['lng'];
$radius = $_GET['radius'];

// Start XML file, create parent node
$doc = domxml_new_doc("1.0");
$node = $doc->create_element("markers");
$parnode = $doc->append_child($node);

$connection=mysql_connect ($dbhost, $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 ASPE table
$query = sprintf("SELECT strasse, nachname, lat, lng, ( 3959 * acos( cos( radians('%s') ) * cos( radians( lat ) ) * cos( radians( lng ) - radians('%s') ) + sin( radians('%s') ) * sin( radians( lat ) ) ) ) AS distance FROM ASPE HAVING distance < '%s' ORDER BY distance LIMIT 0 , 20",
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);

$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->create_element("marker");
$newnode = $parnode->append_child($node);
$newnode->set_attribute("nachname", utf8_encode ($row['nachname']));
$newnode->set_attribute("strasse", utf8_encode ($row['strasse']));
$newnode->set_attribute("lat", $row['lat']);
$newnode->set_attribute("lng", $row['lng']);
$newnode->set_attribute("radius", $row['radius']);
}
//echo $dom->saveXML();

$xmlfile = $doc->dump_file("codierung.xml");
?>

That might be correct, but: it sends me to lat/lng 0.000000/0.000000 (South Pacific), which could mean, that geocoding doesn't work properly. 可能是正确的,但是:它将我发送到lat / lng 0.000000 / 0.000000(南太平洋),这可能意味着地理编码无法正常工作。 But furthermore, no datasets will be filled in the xml, even when adding lat, lng and radius to the URL (eg http://umwelt-und-information.com/maps/ASPE_Adressen_kodieren_3a.php?lat=56.45&lng=6.45&radius=25 ). 但此外,即使将lat,lng和radius添加到URL中,也不会在xml中填充任何数据集(例如, http: //umwelt-und-information.com/maps/ASPE_Adressen_kodieren_3a.php?lat = 56.45&lng = 6.45&radius = 25 )。

May anyone validate the code? 有人可以验证代码吗? Or could anyone please show me a working example with that store locator, if possible with scripting code? 还是有人可以通过脚本代码向我展示该商店定位器的工作示例?

Many thanks in advance! 提前谢谢了! :-) :-)

Your Url shows Invalid query: Unknown column 'address' in 'field list' If all the nodes equate to field name you should generate XML 您的网址显示无效查询:“字段列表”中的未知列“地址”如果所有节点都等于字段名称,则应生成XML 表

Does your table look like this or have you changed the field names? 您的表格看起来是这样还是您更改了字段名称? I have a demo based on the tutorial. 我有一个基于教程的演示 It is based on UK (Try London) but defaults safely if address outside UK are tried (tryParis). 它基于英国(尝试伦敦),但如果尝试尝试英国以外的地址(tryParis),则默认为安全默认值。

If no record are found the map will default to 0,0 (Central Pacific). 如果未找到任何记录,则地图将默认为0,0(中太平洋)。 To default to the location use the following code. 要默认使用该位置,请使用以下代码。

if (mysql_num_rows($result)==0) {
    $node = $dom->createElement("marker");
    $newnode = $parnode->appendChild($node);
    $newnode->setAttribute("nachname", "No Records Found");
    $newnode->setAttribute("lat", $center_lat);
    $newnode->setAttribute("lng", $center_lng);
    }
else {
    Iterate through the rows, adding XML nodes for each
    while ($row = @mysql_fetch_assoc($result)){
    $node = $dom->create_element("marker");
    $newnode = $parnode->append_child($node);
    $newnode->set_attribute("nachname", utf8_encode ($row['nachname']));
    $newnode->set_attribute("strasse", utf8_encode ($row['strasse']));
    $newnode->set_attribute("lat", $row['lat']);    
    $newnode->set_attribute("lng", $row['lng']);
    $newnode->set_attribute("radius", $row['radius']);
   }

consider the pesence of international charater format ASCII insteady of header("Content-type: text/xml"); 考虑使用国际字符格式ASCII代替标题(“ Content-type:text / xml”); put this header("Content-type: text/xml charater utf-8"); 把这个标题(“内容类型:文本/ XML字符UTF-8”); the the xml file will genereted when you run the second file only and assing value to lat,lng and radius 仅当您运行第二个文件并将值设置为lat,lng和radius时,该xml文件将被生成

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

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