我是谷歌地图新手，当我添加KendoUI的Tabstrips时，这个错误就出现了
现在地图都搞砸了，它就像它甚至没有在页面上显示一样，我不知道发生了什么事。我看到的只是Chrome上的错误，它指出了这些代码：
google.maps.event.addListener(map2, 'idle', function () {
$('#places1').find('li a').css('display', function () {
return (map2.getBounds().contains($(this).data('location')))
? ''
: 'none';
});
});
这个
google.maps.event.trigger(map2, 'bounds_changed');
有人可以帮助我解决这种情况，因为我很难解决这个错误
顺便说一下，这是整套代码：
<div id="tabstrip">
<ul>
<li class="k-state-active">Customer </li>
<li>Worker</li>
</ul>
<div>
<div id="map1" >
</div>
<div id="results">
<h2>
Results</h2>
<ul id="places">
</ul>
</div>
</div>
<div>
<div id="map2" style="width: 900px; height: 500px;" >
</div>
<div id="results1">
<h2>
Results</h2>
<ul id="places1">
</ul>
</div>
</div>
</div>
这是脚本：
<script type="text/javascript">
var infoBubble2, geocode2;
var map2;
//var mgr;
function initialize1() {
var minZoomLevel = 4;
var zooms = 7;
geocoder2 = new google.maps.Geocoder();
geocode2 = new google.maps.Geocoder();
$.getJSON('/Dashboard/LoadAddress', function Geocoding(address) {
$.each(address, function () {
var currValAddress = this["AddressLine1"];
geocode1.geocode({ 'address': currValAddress }, function (results1, status) {
if (status == google.maps.GeocoderStatus.OK) {
var addresse = {
zoom: 8,
center: results1[0].geometry.location,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map2 = new google.maps.Map(document.getElementById('map2'), addresse);
// Bounds for North America
var strictBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(15.70, -160.50),
new google.maps.LatLng(68.85, -55.90));
// Listen for the dragend event
google.maps.event.addListener(map2, 'dragend', function () {
if (strictBounds.contains(map2.getCenter())) return;
// We're out of bounds - Move the map back within the bounds
var c = map.getCenter(),
x = c.lng(),
y = c.lat(),
maxX = strictBounds.getNorthEast().lng(),
maxY = strictBounds.getNorthEast().lat(),
minX = strictBounds.getSouthWest().lng(),
minY = strictBounds.getSouthWest().lat();
if (x < minX) x = minX;
if (x > maxX) x = maxX;
if (y < minY) y = minY;
if (y > maxY) y = maxY;
map.setCenter(new google.maps.LatLng(y, x));
});
// Limit the zoom level
google.maps.event.addListener(map2, 'zoom_changed', function () {
if (map2.getZoom() < minZoomLevel) map2.setZoom(minZoomLevel);
});
}
else {
alert("Geocode was not successful for the following reason: " + status);
}
})
});
});
codeAddress1();
}
var iconBase2 = 'https://maps.google.com/mapfiles/kml/shapes/';
function codeAddress1() {
geocoder2 = new google.maps.Geocoder();
infoBubble = new InfoBubble({
map: map2,
shadowStyle: 0,
padding: 10,
borderRadius: 10,
arrowSize: 15,
maxWidth: 300,
borderWidth: 1,
borderColor: '#ccc',
arrowPosition: 50,
arrowStyle: 0
});
$.getJSON('/Dashboard/LoadCustomerList', function Geocode(address) {
$.each(address, function () {
var currVal = this["AddressLine1"];
var Name = this["Name"];
var Gender = this["Gender"];
var Bdate = this["Birthdate"];
var clientID = this["ClientID"];
var ID = this["ID"];
geocoder2.geocode({ 'address': currVal }, function (results1, status) {
setTimeout(function () {
if (status == google.maps.GeocoderStatus.OK) {
var marker = new google.maps.Marker({
map: map2,
icon: iconBase2 + 'man.png',
position: results1[0].geometry.location,
title: currVal
})
var link = $('<a href="#">' + currVal + '</a>')
.data('location', results1[0].geometry.location);
$('#places1').append($('<li id=Meow1>').append(link));
link.on('click', function (event) {
event.preventDefault();
google.maps.event.trigger(address[0], "click");
infoBubble.removeTab(0);
infoBubble.addTab(Name, "Name: " + Name + "<br> Address: " + currVal + "<br> Gender: " + Gender + "<br> Birthdate: " + Bdate + "<br><br>" + '<center><a href="/Customer/CustomerDetails?clientCusId=' + ID + '&clientId=' + clientID + '">View Profile</a></center>');
infoBubble.open(map2, marker);
});
google.maps.event.addListener(map2, 'idle', function () {
$('#places1').find('li a').css('display', function () {
return (map2.getBounds().contains($(this).data('location')))
? ''
: 'none';
});
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infoBubble.removeTab(0);
infoBubble.addTab(Name, "Name: " + Name + "<br> Address: " + currVal + "<br> Gender: " + Gender + "<br> Birthdate: " + Bdate + "<br><br>" + '<center><a href="/Customer/CustomerDetails?clientCusId=' + ID + '&clientId=' + clientID + '">View Profile</a></center>');
infoBubble.open(map2, marker);
}
})(marker, currVal));
address.push(marker);
}
else if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
// setTimeout(function () {
// Geocode(address);
// }, 200);
}
else {
alert("Geocode was not successful for the following reason: " + status);
}
})
});
});
google.maps.event.trigger(map2, 'bounds_changed');
});
}
window.onload = function () {
initialize1();
}
</script>
@*<script type="text/javascript">
var geocoder, infoBubble, geocode;
var map;
//var mgr;
function initialize() {
var minZoomLevel = 4;
var zooms = 7;
geocoder = new google.maps.Geocoder();
geocode = new google.maps.Geocoder();
$.getJSON('/Dashboard/LoadAddress', function Geocoding(address) {
$.each(address, function () {
var currValAddress = this["AddressLine1"];
geocode.geocode({ 'address': currValAddress }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var addresse = {
zoom: 8,
center: results[0].geometry.location,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map1'), addresse);
// Bounds for North America
var strictBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(15.70, -160.50),
new google.maps.LatLng(68.85, -55.90));
// Listen for the dragend event
google.maps.event.addListener(map, 'dragend', function () {
if (strictBounds.contains(map.getCenter())) return;
// We're out of bounds - Move the map back within the bounds
var c = map.getCenter(),
x = c.lng(),
y = c.lat(),
maxX = strictBounds.getNorthEast().lng(),
maxY = strictBounds.getNorthEast().lat(),
minX = strictBounds.getSouthWest().lng(),
minY = strictBounds.getSouthWest().lat();
if (x < minX) x = minX;
if (x > maxX) x = maxX;
if (y < minY) y = minY;
if (y > maxY) y = maxY;
map.setCenter(new google.maps.LatLng(y, x));
});
// Limit the zoom level
google.maps.event.addListener(map, 'zoom_changed', function () {
if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel);
});
}
else {
alert("Geocode was not successful for the following reason: " + status);
}
})
});
});
codeAddress();
}
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
function codeAddress() {
infoBubble = new InfoBubble({
map: map,
shadowStyle: 0,
padding: 10,
borderRadius: 10,
arrowSize: 15,
maxWidth: 300,
borderWidth: 1,
borderColor: '#ccc',
arrowPosition: 50,
arrowStyle: 0
});
$.getJSON('/Dashboard/LoadWorkerList', function Geocode(address) {
$.each(address, function () {
var currVal = this["AddressLine1"];
var Name = this["Name"];
var Gender = this["Gender"];
var Bdate = this["Birthdate"];
var ID = this["Worker_ID"];
geocoder.geocode({ 'address': currVal }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var marker = new google.maps.Marker({
map: map,
icon: iconBase + 'man.png',
position: results[0].geometry.location,
title: currVal
})
var link = $('<a href="#">' + currVal + '</a>')
.data('location', results[0].geometry.location);
$('#places').append($('<li id=Meow>').append(link));
link.on('click', function (event) {
event.preventDefault();
google.maps.event.trigger(address[0], "click");
infoBubble.removeTab(0);
infoBubble.addTab(Name, "Name: " + Name + "<br> Address: " + currVal + "<br> Gender: " + Gender + "<br> Birthdate: " + Bdate + "<br><br>" + '<center><a href="/Worker/WorkerDetails?workerId=' + ID + '">View Profile</a></center>');
infoBubble.open(map, marker);
});
google.maps.event.addListener(map, 'idle', function () {
$('#places').find('li a').css('display', function () {
return (map.getBounds().contains($(this).data('location')))
? ''
: 'none';
});
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infoBubble.removeTab(0);
infoBubble.addTab(Name, "Name: " + Name + "<br> Address: " + currVal + "<br> Gender: " + Gender + "<br> Birthdate: " + Bdate + "<br><br>" + '<center><a href="/Worker/WorkerDetails?workerId=' + ID + '">View Profile</a></center>');
infoBubble.open(map, marker);
}
})(marker, currVal));
address.push(marker);
}
else if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
// setTimeout(function () {
// Geocode(address);
// }, 200);
}
else {
alert("Geocode was not successful for the following reason: " + status);
}
})
});
google.maps.event.trigger(map, 'bounds_changed');
});
}
window.onload = function () {
initialize();
}
</script>