我已经使用Google的这个教程来构建一个Web应用程序,该应用程序从用户输入的位置找到最近的商店:
http://code.google.com/apis/maps/articles/phpsqlsearch_v3.html
我的应用程序几乎按照我想要的方式工作,在页面加载时,地图被加载,居中并设置为缩放级别6,用户用他们的位置填写表单.
然后,应用程序从数据库中提取所有商店信息,并使用每个标记填充地图.
缩放级别似乎也在减少,但我无法在任何地方的代码中找到它.
我实际想要提交的内容是放大到缩放级别6并将地图中心放在用户输入位置的纬度和经度以及最近的商店的输出信息上,例如最近的商店.我想知道这里是否有人知道如何实现这个功能?
的index.php
<div>
<input type="text" id="addressInput" size="50"/>
<input type="hidden" id="radiusSelect" value="5"/>
<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:50%"></div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<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(54.600939134593, -2.399894114594),
zoom: 6,
mapTypeId: 'roadmap',
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
});
infoWindow = new google.maps.InfoWindow();
locationSelect = document.getElementById("locationSelect");
locationSelect.onchange = function() {
var markerNum …Run Code Online (Sandbox Code Playgroud)