我正在尝试为页面上的表格中的每一行添加标记。该页面是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);
}
});
});
我没有任何错误,但是团队标记未显示。奇怪的是,城市标记确实出现了。
有关更多信息,City Markers 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。因此,您必须修复表生成器。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句