我编写了一个网站(基于html,css),可以在指定的地方搜索医生(此时从数据库/ SQL)。 我还想要一张地图,向用户展示他周围的医生。
所以我做了一些GoogleMaps-Places-API和其他API的实验,但我的编程技巧很难做到这一点/了解该怎么做!
我需要一张可以发现用户并以他为中心的地图 - 并在他的位置设置一个标记。在用户定义了搜索区域后,地图应切换到此位置并显示所有医生(可能由医生主体过滤)。
最好的方法是使用我的PHP输入字段(用于数据库请求)并将其与地图连接?
第一个脚本是我的实验图。它居中但不会在用户周围设置任何位置标记。
第二个脚本是我的php请求,用于与sql数据库通信。
<script>
var map;
var stepDisplay;
var service;
function initialize(coords) {
var latlng = new google.maps.LatLng(coords.latitude, coords.longitude);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: "Hier bist du :)"
});
}
navigator.geolocation.getCurrentPosition(function(position){
initialize(position.coords);
},
function(){
document.getElementById('map_canvas').innerHTML = 'Deine Position konnte leider nicht ermittelt werden';
});
google.maps.event.addDomListener(window, 'load', initialize);
</script>
&#13;
<?php
//Datenbank einbinden
include("config.inc.php");
if (logged_in()) header('Location: http://localhost/n_a_h.php');
$con = mysqli_connect(host,user,pass) or die ("Fehler beim Verbinden mit der Datenbank!");
mysqli_select_db($con, database) or die ("Fehler beim Öffnen der Datenbank");
echo "<form action = '' target='_self' method = 'post' name='fachr' target'_self'>";
//Auswahl Fachrichtung
echo "Fachrichtung: ";
echo "<select name='ps_fachrichtung'>";
echo "<option value=''>Bitte wählen...</option>";
$sql_fr = "select fachrichtung from t_fachrichtung";
$res_fr=mysqli_query($con, $sql_fr);
while ($dsatz_fr = mysqli_fetch_array($res_fr))
{
echo "<option>".$dsatz_fr["fachrichtung"]."</option>";
}
echo "</select>";
//Auswahl PLZ Ort
echo "PLZ / Ort: ";
echo "<id='ps_plz_ort'><input name='ps_plz_ort' />";
echo "<input type = 'submit' name = 'ps_senden' value='Bestätigen' size ='20' />";
echo "</form>";
//ablauf der Suche
if (isset($_POST['ps_senden']))
{
//Ausgewählten Fachbereich anzeigen
$ps_fr = $_POST["ps_fachrichtung"];
$ps_plz_ort = $_POST["ps_plz_ort"];
preg_match("(\d+)",$ps_plz_ort,$ps_plz);
$ps_ort=explode(" ", $ps_plz_ort);
$lg=count($ps_ort);
$ps_plz_kon="no";
for ($i=0; $i<$lg; $i++)
{
if (is_numeric($ps_ort[$i]))
{
//$ps_plz[0]=$ps_ort[$i];
if ($i==0) $k=1;
else $k=2;
$ps_plz_kon="yes";
break;
}
}
$ps_ort[0]=implode(" ",$ps_ort);
//echo "$k<br />";
//echo "$ps_plz_kon<br />";
if ($ps_plz_kon=="yes")
{
if ($k==1) $ps_ort[0]=substr($ps_ort[0],6);
else $ps_ort[0]=substr($ps_ort[0],0,-6);
}
//echo "<br />";
//echo $ps_plz_ort;
//echo "<br />";
//echo $ps_plz[0];
//echo "<br />";
//echo $ps_ort[0];
echo "<br />";
echo "Fachbereich: ";
echo "$ps_fr<br />";
//Ärzte suchen und anzeigen
if ($ps_plz_kon=="no")
{
$sql_erg = "select * from t_arzt where A_Fachrichtung = '$ps_fr' AND A_Ort = '$ps_ort[0]'";
}
else
{
if ($ps_ort[0]=="") $sql_erg = "select * from t_arzt where A_Fachrichtung = '$ps_fr' AND A_PLZ = '$ps_plz[0]'";
else $sql_erg = "select * from t_arzt where A_Fachrichtung = '$ps_fr' AND (A_Ort = '$ps_ort[0]' OR A_PLZ = '$ps_plz[0]')";
}
$res_erg = mysqli_query($con, $sql_erg);
$num_erg = mysqli_num_rows($res_erg);
switch($num_erg)
{
case ($num_erg == 0):
echo "Es wurden keine Ärzte in Ihrer Nähe gefunden.<br />";
break;
case ($num_erg == 1):
echo "Es wurde ".$num_erg." Arzt in Ihrer Umgebung gefunden.<br />";
break;
case ($num_erg >= 2):
echo "Es wurden ".$num_erg." Ärzte in Ihrer Umgebung gefunden.<br />";
}
//if ($num_erg==0) echo "Es wurden keine Ärzte in Ihrer Nähe gefunden.<br />";
//else echo "Es wurde(n) ".$num_erg." Ärzt(e) in Ihrer Umgebung gefunden.<br />";
if ($num_erg > 0)
{
echo "<br/>";
echo "<table border width='50 %'>";
echo "<tr align='center'>";
echo "<td><b>Praxis</b></td>";
echo "<td><b>Adresse</b></td>";
echo "<td><b>Wartezeit</b></td>";
echo"</tr>";
while ($dsatz_erg = mysqli_fetch_assoc($res_erg))
{
//echo $dsatz_erg["A_Titel"]." ".$dsatz_erg["A_Nachname"].", ".$dsatz_erg["A_Vorname"].", ".$dsatz_erg["A_Strasse"]." ".$dsatz_erg["A_Hausnr"].", ".$dsatz_erg["A_PLZ"]." ".$dsatz_erg["A_Ort"]. "<br />";
echo "<tr>";
echo "<td>" .$dsatz_erg["A_Titel"]." ".$dsatz_erg["A_Nachname"].", ".$dsatz_erg["A_Vorname"]. "</td>";
echo "<td>" .$dsatz_erg["A_Strasse"]." ".$dsatz_erg["A_Hausnr"].", ".$dsatz_erg["A_PLZ"]." ".$dsatz_erg["A_Ort"]. "</td>";
echo "<td>" .$dsatz_erg["A_Wartezeit"]." min</td>";
echo "</tr>";
}
echo "</table>";
}
}
?>
<!-- <p class="Text">Praxis Suchen</p> -->
&#13;
答案 0 :(得分:0)
如果您使用PHP(或任何其他服务器端编程语言)或jQuery或JSON文档将标记提供给您的标记数组,则更为重要
试试这个片段(我已经测试过了):
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&"></script>
<script type="text/javascript">
var mapObj;
function initialize() {
var myOptions = {
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var mapObj = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var bounds = new google.maps.LatLngBounds();
// Try HTML5 geolocation
if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(function(position)
{
var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
var infowindow = new google.maps.InfoWindow({
map: mapObj,
position: pos,
content: 'Deine Position'
});
mapObj.setCenter(pos);
}, function()
{
var options = {
map: mapObj,
position: new google.maps.LatLng(60, 105),
content: content
};
var infowindow = new google.maps.InfoWindow(options);
mapObj.setCenter(options.position);
});
} else {
// Browser doesn't support Geolocation
}
var infowindow = new google.maps.InfoWindow();
var markers = []; //array to hold markers
// Multiple Markers
markers.push(['London Eye, London', 51.503454, -0.119562]);
markers.push(['Palace of Westminster, London', 51.499633, -0.124755]);
// Loop through your array of markers and add them to mapObj
for (i = 0; i < markers.length; i++)
{
//create a latitude / longitude object first:
var pointLatLng = new google.maps.LatLng(markers[i][1],markers[i][2]);
//extend map to include new marker
bounds.extend(pointLatLng);
//create the marker object:
markerObj = new google.maps.Marker({
position: pointLatLng,
map: mapObj,
title: markers[i][0]
});
google.maps.event.addListener(markerObj, 'click', (function(markerObj, i) {
return function() {
infowindow.setContent("info window: "+ markers[i][0]);
infowindow.open(mapObj, markerObj);
}
})(markerObj, i));
// center map fitting all markers on the screen
mapObj.fitBounds(bounds);
markerObj.setMap(mapObj);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
然后,您将使用数组来存储标记数据。希望这是有道理的。
请注意,如果您无法访问所需标记的纬度和经度,则还可以选择代码地址: geocoder.geocode({'address':addressString}