【发布时间】：2014-06-01 02:09:01
【问题描述】：
这是我的第一篇文章，目前处于网络开发任务的严峻形势，这要求我们创建一个基于 php 的网站，允许用户使用谷歌地图 API 搜索 wifi 位置。但是，当我运行代码时，我得到的只是一张空白地图，没有错误。
非常感谢您的帮助。
谢谢
<!DOCTYPE html>
<!-- HTML5 doctype-->
<html>
<!-- Start of html document-->
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org"><!-- Header which calls the relevant stylesheets for display. It also outlines the page title and initial scale. -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta>
<title>Reece & Andy INB271 Website</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" href="small-device.css">
<link rel="stylesheet" type="text/css" media="only screen and (max-width: 700px), only screen and (max-device-width: 700px)" href="med-device.css">
<link rel="stylesheet" type="text/css" media="only screen and (max-width: 980px), only screen and (max-device-width: 980px)" href="large-device.css">
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false">
</script>
<script type="text/javascript">
<!-- source for the google maps api script-->
function getLocation()
{
var x=document.getElementById("usercoords");
if (navigator.geolocation)
{
//runs showposition function
navigator.geolocation.getCurrentPosition(showPosition);
}
else
{
x.innerHTML="Geolocation not supported.";
}
}
function showPosition(position)
{
var x=document.getElementById("usercoords");
//adds coordinates to html at id "usercoords"
x.value=position.coords.latitude + "," + position.coords.longitude;
document.getElementById("search").submit();
}
function initialize()
{
var mapOptions =
{
zoom: 10,
center: new google.maps.LatLng(-27.4699404325,153.02562796)
}
var map = new google.maps.Map(document.getElementById('map-search'), mapOptions);
//sets markers
setMarkers(map, hotspots);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<!-- Body of the website containing the wrapper, nav, search and content divs. -->
<body>
<div id="wrap"><!-- The wrapper for the whole website -->
<?php include 'header.php'; ?>
<div id="content">
<h1>Location Search</h1>
<p id="Click">Click the button to get your position:</p>
<button onclick="getLocation()">View Location</button> <!-- when clicked, returns geo location marker on map -->
<br>
<div id="Breaker"><!-- Textbox field for the Hotspot name -->
<p><label>Hotspot Name:</label> <input type="text" name="name"></p>
<!-- Number input for the rating with a minimum of 1 and maximum of 5 (i.e. rating can't be 6 or 0) !-->
<p><label>Hotspot Rating:</label> <input type="number" name="rating"></p>
<!-- Radio button input that uses geolocation (if yes is selected and access is granted) to retrieve the user's current location !-->
<p><label>Nearby Playgrounds:</label> <input id="r-yes" type="radio" name="geo" value="yes" onclick="getLocation()"><label for="r-yes" onclick="getLocation()">Yes</label> <input id="r-no" type="radio" name="geo" value="no" checked="true"><label for="r-no">No</label></p>
<h4>Search By Suburb</h4>
<!-- <!== search using the form-->
<form id="form3"><!-- fields and styling for the dropdown -->
<select name="Suburb">
<option value="West End, 4101">West End</option>
<option value="Wynnum, 4178">Wynnum</option>
<option value="Zillmere, 4034">Zillmere</option>
<!-- search box-->
<!-- Onclick RETURNS RESULTS !-->
<!-- closes the article --></select></form>
<!-- closes the form --></div>
</div>
<!-- This is the page right sidebar and includes linkes to nearby hotspots and recent hot spot reviews. -->
<?php include 'sidebar.php'; ?><!-- This is the footer for the website. It includes our student numbers, names and the council logo. -->
<?php include 'footer.php'; ?></div>
</body>
</html>
【问题讨论】：
-
你给热点分配了什么？
-
我做到了，但为了代码长度，我删除了热点代码，这些代码只是地图标记。 （有超过 50 个标记）
-
“地图搜索”div在哪里？
-
这个问题似乎离题了，因为它包含很多信息来诊断问题。最小化你的代码，只隔离显示问题的代码，stackoverflow.com/help/mcve，这样做你可以自己识别和解决。
标签： php html api geolocation maps