我面臨我的Google Maps API存在的問題。我從開發人員創建的腳本已經消失,並且不會回覆我hahaGoogle地圖API標記不會顯示在地圖上
幾個星期前它正在工作,當我開始測試整個站點時突然停止工作。我找不到它有什麼問題。由於我是Google Maps API的新手,因此我需要有人幫助我解決這個問題。
腳本應該找到給定地址周圍的地方。
它應該工作的方式是:
- 腳本抓住從頁面
- 使用谷歌的地理編碼API的地址轉換來獲得朗/緯度值
- 然後使用谷歌Places API的帖地址lang/lat獲取地址周圍的地點。
我調試了腳本,好像Geocode API正在工作,當我們查詢Google Places API時,沒有任何東西被取回。
我使用的是最新的jQuery庫和下面的谷歌API庫:https://maps.googleapis.com/maps/api/js?libraries=places
請找到下面的代碼:
$(document).ready(function()
{
address = $("#address").text();
});
var map;
var infowindow;
var map;
var map_street;
var service;
var service_local_info;
var request_school;
var request_restaurant;
var request_healthcare;
var request_foodstores;
var restaurant_markers = [];
var school_markers = [];
var healthcare_markers = [];
var foodstores_markers = [];
var latitude;
var longitude;
var panorama;
var panoramaOptions;
var schoolName;
var trafficLayer;
var address = "";
var infowindow;
var counter = 0;
function trafic()
{
if($("#trafic").is(":checked"))
{
trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
}
else
{
trafficLayer.setMap(null);
}
}
function street_view()
{
panorama = new google.maps.StreetViewPanorama(document.getElementById("street-view"), panoramaOptions);
map.setStreetView(panorama);
}
function local_info()
{
$("#distance_school").html('<div class="breadcrumb"><i class="glyphicon glyphicon-certificate"></i> Schools</div>');
$("#distance_restaurant").html('<div class="breadcrumb"><i class="glyphicon glyphicon-cutlery"></i> Restaurants</div>');
$("#distance_healthcare").html('<div class="breadcrumb"><i class="glyphicon glyphicon-heart"></i> Health Care</div>');
$("#distance_foodstores").html('<div class="breadcrumb"><i class="glyphicon glyphicon-glass"></i> Food Stores</div>');
var location_local_info;
geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': address}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
location_local_info = results[0].geometry.location;
latitude = location_local_info.k;
longitude = location_local_info.D;
map = new google.maps.Map(document.getElementById('map2'), {
center: location_local_info,
zoom: 15
});
service = new google.maps.places.PlacesService(map);
request_school = {
location: location_local_info,
radius: 500,
types: ["school"]
};
service.nearbySearch(request_school, school_local_info_callback);
request_restaurant = {
location: location_local_info,
radius: 500,
types: ["restaurant"]
};
service.nearbySearch(request_restaurant, restaurant_local_info_callback);
request_healthcare = {
location: new google.maps.LatLng(latitude, longitude),
radius: 500,
types: ["health"]
};
service.nearbySearch(request_healthcare, healthcare_local_info_callback);
request_foodstores = {
location: new google.maps.LatLng(latitude, longitude),
radius: 500,
types: ["food"]
};
service.nearbySearch(request_foodstores, foodstores_local_info_callback);
}
else
{
alert("error in location");
}
});
}
function healthcare()
{
if($("#healthcare").is(":checked"))
{
request_healthcare = {
location: new google.maps.LatLng(latitude, longitude),
radius: 500,
types: ["health"]
};
service.nearbySearch(request_healthcare, healthcare_marker);
}
else
{
for(i=0; i<healthcare_markers.length; i++)
{
healthcare_markers[i].setMap(null);
}
}
}
function foodstores()
{
if($("#foodstores").is(":checked"))
{
request_foodstores = {
location: new google.maps.LatLng(latitude, longitude),
radius: 500,
types: ["food"]
};
service.nearbySearch(request_foodstores, foodstores_marker);
}
else
{
for(i=0; i<foodstores_markers.length; i++)
{
if(foodstores_markers[i])
{
foodstores_markers[i].setMap(null);
}
}
}
}
function school()
{
if($("#school").is(":checked"))
{
request_school = {
location: new google.maps.LatLng(latitude, longitude),
radius: 500,
types: ["school"] //school,
};
service.nearbySearch(request_school, school_marker);
}
else
{
for(i=0; i<school_markers.length; i++)
{
school_markers[i].setMap(null);
}
}
}
function restaurant()
{
if($("#restaurant").is(":checked"))
{
request_restaurant =
{
location: new google.maps.LatLng(latitude, longitude),
radius: 500,
types: ["restaurant"] //school,
};
service.nearbySearch(request_restaurant, restaurant_marker);
}
else
{
for(i=0; i<restaurant_markers.length; i++)
{
restaurant_markers[i].setMap(null);
}
}
}
function initialize()
{
$('#restaurant').attr('checked', false);
$('#school').attr('checked', false);
$('#trafic').attr('checked', false);
$('#healthcare').attr('checked', false);
$('#foodstores').attr('checked', false);
var location;;
geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': address}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
location = results[0].geometry.location;
latitude = location.k;
longitude = location.D;
map = new google.maps.Map(document.getElementById('map2'), {
center: location,
zoom: 15
});
map_street = new google.maps.Map(document.getElementById('street-view'), {
center: location,
zoom: 15
});
var marker = new google.maps.Marker({
map: map,
animation: google.maps.Animation.BOUNCE,
//icon:"restaurant.jpg",
position: location
});
service = new google.maps.places.PlacesService(map);
panoramaOptions = {
position: location,
pov: {
heading: 34,
pitch: 10
}
};
}
else
{
alert("error in location");
}
});
}
function restaurant_marker(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{
restaurant_markers[i] = new google.maps.Marker({
map: map,
//icon:"restaurant.jpg",
position: results[i].geometry.location
});
google.maps.event.addListener(restaurant_markers[i], 'click', function()
{
if(infowindow)
{
infowindow.close();
}
for(var j=0; j<results.length; j++)
{
if(results[j].geometry.location.k == this.position.k && results[j].geometry.location.D == this.position.D)
{
infowindow = new google.maps.InfoWindow({
content: "<div style='overflow-y:none;'><b>Name</b> : "+results[j].name+"<br><b>Address</b> : "+results[j].vicinity+"</div>",
maxWidth: 1000,
maxHeight: 3000
});
infowindow.open(map,this);
}
}
});
}
}
}
function school_marker(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{
school_markers[i] = new google.maps.Marker({
map: map,
//icon:"school.png",
position: results[i].geometry.location
});
google.maps.event.addListener(school_markers[i], 'click', function()
{
if(infowindow)
{
infowindow.close();
}
for(var j=0; j<results.length; j++)
{
if(results[j].geometry.location.k == this.position.k && results[j].geometry.location.D == this.position.D)
{
infowindow = new google.maps.InfoWindow({
content: "<div style='overflow-y:none;'><b>Name</b> : "+results[j].name+"<br><b>Address</b> : "+results[j].vicinity+"</div>",
maxWidth: 1000,
maxHeight: 3000
});
infowindow.open(map,this);
}
}
});
}
}
}
function healthcare_marker(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{
healthcare_markers[i] = new google.maps.Marker({
map: map,
//icon:"school.png",
position: results[i].geometry.location
});
google.maps.event.addListener(healthcare_markers[i], 'click', function()
{
if(infowindow)
{
infowindow.close();
}
for(var j=0; j<results.length; j++)
{
if(results[j].geometry.location.k == this.position.k && results[j].geometry.location.D == this.position.D)
{
infowindow = new google.maps.InfoWindow({
content: "<div style='overflow-y:none;'><b>Name</b> : "+results[j].name+"<br><b>Address</b> : "+results[j].vicinity+"</div>",
maxWidth: 1000,
maxHeight: 3000
});
infowindow.open(map,this);
}
}
});
}
}
}
function foodstores_marker(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{
if(results[i].types.indexOf("restaurant") == -1)
{
foodstores_markers[i] = new google.maps.Marker({
map: map,
//icon:"school.png",
position: results[i].geometry.location
});
google.maps.event.addListener(foodstores_markers[i], 'click', function()
{
if(infowindow)
{
infowindow.close();
}
for(var j=0; j<results.length; j++)
{
if(results[j].types.indexOf("restaurant") == -1)
{
if(results[j].geometry.location.k == this.position.k && results[j].geometry.location.D == this.position.D)
{
infowindow = new google.maps.InfoWindow({
content: "<div style='overflow-y:none;'><b>Name</b> : "+results[j].name+"<br><b>Address</b> : "+results[j].vicinity+"</div>",
maxWidth: 1000,
maxHeight: 3000
});
infowindow.open(map,this);
}
}
}
});
}
}
}
}
function school_local_info_callback(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length && i < 6; i++)
{
calculate_distance_school(results[i].geometry.location, results[i].name);
}
}
}
function restaurant_local_info_callback(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length && i < 6; i++)
{
calculate_distance_restaurant(results[i].geometry.location, results[i].name);
}
}
}
function healthcare_local_info_callback(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length && i < 6; i++)
{
calculate_distance_healthcare(results[i].geometry.location, results[i].name);
}
}
}
function foodstores_local_info_callback(results, status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
for (var i = 0; i < results.length; i++)
{
if(results[i].types.indexOf("restaurant") == -1)
{
calculate_distance_foodstores(results[i].geometry.location, results[i].name);
counter++;
if(counter == 6)
break;
}
}
counter = 0;
}
}
function calculate_distance_school(origin, name)
{
var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
{
origins: [origin],
destinations: [new google.maps.LatLng(latitude, longitude)],
travelMode: google.maps.TravelMode.DRIVING,
unitSystem: google.maps.UnitSystem.IMPERIAL,
avoidHighways: false,
avoidTolls: false
}, function (response, status)
{
if (status == google.maps.DistanceMatrixStatus.OK)
{
var result = response.rows[0].elements;
$("#distance_school").append("<div class=\"col-xs-12 col-sm-4 col-md-4 local-body\"><h4>"+name+"</h4><p><strong>Distance :</strong> "+result[0].distance.text+"les</p></div>");
}
else
{
alert(status);
}
});
}
function calculate_distance_restaurant(origin, name)
{
var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
{
origins: [origin],
destinations: [new google.maps.LatLng(latitude, longitude)],
travelMode: google.maps.TravelMode.DRIVING,
unitSystem: google.maps.UnitSystem.IMPERIAL,
avoidHighways: false,
avoidTolls: false
}, function (response, status)
{
if (status == google.maps.DistanceMatrixStatus.OK)
{
var result = response.rows[0].elements;
$("#distance_restaurant").append("<div class=\"col-xs-12 col-sm-4 col-md-4 local-body\"><h4>"+name+"</h4><p><strong>Distance :</strong> "+result[0].distance.text+"les</p></div>");
}
else
{
alert(status);
}
});
}
function calculate_distance_healthcare(origin, name)
{
var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
{
origins: [origin],
destinations: [new google.maps.LatLng(latitude, longitude)],
travelMode: google.maps.TravelMode.DRIVING,
unitSystem: google.maps.UnitSystem.IMPERIAL,
avoidHighways: false,
avoidTolls: false
}, function (response, status)
{
if (status == google.maps.DistanceMatrixStatus.OK)
{
var result = response.rows[0].elements;
$("#distance_healthcare").append("<div class=\"col-xs-12 col-sm-4 col-md-4 local-body\"><h4>"+name+"</h4><p><strong>Distance :</strong> "+result[0].distance.text+"les</p></div>");
}
else
{
alert(status);
}
});
}
function calculate_distance_foodstores(origin, name)
{
var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
{
origins: [origin],
destinations: [new google.maps.LatLng(latitude, longitude)],
travelMode: google.maps.TravelMode.DRIVING,
unitSystem: google.maps.UnitSystem.IMPERIAL,
avoidHighways: false,
avoidTolls: false
}, function (response, status)
{
if (status == google.maps.DistanceMatrixStatus.OK)
{
var result = response.rows[0].elements;
$("#distance_foodstores").append("<div class=\"col-xs-12 col-sm-4 col-md-4 local-body\"><h4>"+name+"</h4><p><strong>Distance :</strong> "+result[0].distance.text+"les</p></div>");
}
else
{
alert(status);
}
});
}
哇,近600行的javascript你要我們調試!請發佈一個[最小化,完整和可驗證的示例](http://stackoverflow.com/help/mcve)而不是 – duncan
Hi @duncan如上所述我對Google Maps API沒有任何線索,因爲它不是從我那裏完成的我對JS的知識知之甚少。我相信這是爲地圖做所有事情的腳本。對不起,如果我複製了一切。 – Cam
如果你對JS沒有線索,你可能想讓其他人蔘與來幫助你。在這裏給出的答案可能是相當技術 – duncan