我正在尝试为页面上表格中的每一行添加标记。页面是http://www.sravanks.com/first/2013ftcmap.php
这是加载标记的 JS 代码:
$(document).ready(function() {
var mapOptions = {
center: new google.maps.LatLng(39.740, -89.503),
zoom: 7
};
var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
var infowindow = new google.maps.InfoWindow();
/* City Markers */
var cityCircle = new Array();
var i = 0;
$.each($('.events tr'), function(index, value) {
var name = $(this).find('td:first()').html();
var address = $(this).find('.address').html();
var linkUrl = "http://www.sravanks.com/first/geocode.php?address=" + address;
$.ajax({
url: linkUrl
}).done(function(data){
var json = $.parseJSON(data.substring(0, data.length-1));
lat = json.results[0].geometry.location.lat;
lng = json.results[0].geometry.location.lng;
var latlng = new google.maps.LatLng(lat, lng);
var marker = new google.maps.Marker({ position: latlng, map: map, icon: 'map-pointer-medium.gif' });
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(name);
infowindow.open(map, marker);
cityCircle[i] = new google.maps.Circle({strokeColor: '#00FF00', strokeOpacity: 0.8, strokeWeight: 2, fillColor: '#00FF00', fillOpacity: 0.35, map: map, center: latlng, radius: 144841});
i++;
});
});
});
/*Team Markers*/
var markers = {};
var teamName, teamNumber, lat, lng, content;
$.each($('.list tr'), function(index, value) {
teamName = $(this).find('td.name').html();
teamNumber = $(this).find('td.number').html();
markers[teamNumber] = {};
lat = parseFloat($(this).find('td.lat').html());
lng = parseFloat($(this).find('td.lng').html());
content = "Name: " + teamName + "<br />Number: " + teamNumber;
markers[teamNumber]['latlng'] = new google.maps.LatLng(lat, lng);
markers[teamNumber]['marker'] = new google.maps.Marker({ position: markers[teamNumber]['latlng'], map: map });
google.maps.event.addListener(markers[teamNumber]['marker'], 'click', function() {
infowindow.setContent(content);
infowindow.open(map, markers[teamNumber]['marker']);
});
});
google.maps.event.addListener(infowindow, 'closeclick', function() {
for(var i=0;i<cityCircle.length;i++){
cityCircle[i].setMap(null);
}
});
});
我没有错误,但团队标记没有显示。奇怪的是,城市标记确实出现了。
更多信息,城市标记 ajax 调用仅针对调用 google 地理编码 API 的代理。链接再次位于 http://www.sravanks.com/first/2013ftcmap.php
最佳答案
您的团队标记确实出现了,但它们都位于土耳其或格鲁吉亚的某个地方,因为团队数据表的纬度/经度有错误:
<tr>
<td class="number">111</td>
<td class="name">MiniStang</td>
<td class="address">Schaumburg, IL 60196 USA</td>
<td class="lat">42.070247650146</td>
<td class="lng">42.070247650146</td>
</tr>
记下纬度和经度值。他们有相同的号码。经度应该类似于 -87.62806429999999。所以你必须修复你的表生成器。
关于javascript - Google map API - 标记未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24113241/