大家好,我遇到了一些我不明白为什么的问题,我已经尝试用谷歌搜索我得到的错误,但它没有帮助。似乎是我markercluster
造成了问题,但我确实在其他应用程序中尝试过它工作得很好。我试过删除
var markerCluster = new MarkerClusterer(map, markers);
但我有另一个错误是
未捕获的类型错误:无法读取未定义的属性“__e3_”
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCWDPCiH080dNCTYC-uprmLOn2mt2BMSUk&sensor=true"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js"></script>
<script type="text/javascript" src="findout.js"></script>
findout.js
var markers = [];
var places =Array();
function createTooltip(marker, key) {
//create a tooltip
var tooltipOptions={
marker:marker,
content:places[key].tooltip_html,
cssClass:'tooltip' // name of a css class to apply to tooltip
};
var tooltip = new Tooltip(tooltipOptions);
}
function refresh(){
setInterval(function(){
loadMarker();
},5000);
};
function initialize() {
var initialLocation;
var northpole = new google.maps.LatLng(90, 105);
var KL = new google.maps.LatLng(3.1597,101.7000);
var browserSupportFlag = new Boolean();
var map;
var marker;
var mapOptions;
var mapDiv = document.getElementById("map_canvas");
if(places.length){
mapOptions = {
center: new google.maps.LatLng(3.1597,101.7000),
maxZoom:21,
zoom: 17,
disableDefaultUI: true,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position: google.maps.ControlPosition.TOP_LEFT
}
};
map = new google.maps.Map(mapDiv,mapOptions );
for (var key in places){
(function(myPlace){
if (myPlace) {
if(myPlace.icon_html !== ''){
var icon = {
url:myPlace.icon_html,
origin:new google.maps.Point(0,0),
anchor:new google.maps.Point(8,41)
};
var shadow={
url:"image/shadow.png",
origin: new google.maps.Point(0,0),
anchor:new google.maps.Point(8,41)
};
}else{
var icon = {
url:"image/default.png",
origin:new google.maps.Point(0,0),
anchor:new google.maps.Point(8,41)
};
var shadow={
url:"image/shadow.png",
origin: new google.maps.Point(0,0),
anchor:new google.maps.Point(8,41)
};
}
var marker = new google.maps.Marker({
map: map,
shadow:shadow,
url:myPlace.URL_html,
icon:icon,
position: new google.maps.LatLng(myPlace.position.lat, myPlace.position.lng)
});
markers.push(marker);
createTooltip(marker, key);
google.maps.event.addListener(marker, 'click', function() {
marker.setAnimation(google.maps.Animation.BOUNCE);
setTimeout(function() {marker.setAnimation(null);}, 2000);
openNewBackgroundTab(marker.url);
});
function openNewBackgroundTab(url){
var a = document.createElement("a");
a.href = url;
var evt = document.createEvent("MouseEvents");
//the tenth parameter of initMouseEvent sets ctrl key
evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
true, false, false, false, 0, null);
a.dispatchEvent(evt);
}
}
})(places[key]);
}
}
var markerCluster = new MarkerClusterer(map, markers);
// Try W3C Geolocation (Preferred)
if(navigator.geolocation) {
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
var marker = new google.maps.Marker({
position:initialLocation,
icon:'image/user.png',
title:'You are here !'
});
$('#findout').on('shown', function (e) {
google.maps.event.trigger(map, 'resize');
marker.setMap(map);
map.setCenter(initialLocation);
});
}, function() {
handleNoGeolocation(browserSupportFlag);
});
}
// Browser doesn't support Geolocation
else {
browserSupportFlag = false;
handleNoGeolocation(browserSupportFlag);
}
function handleNoGeolocation(errorFlag) {
if (errorFlag === true) {
alert("Geolocation service failed.");
initialLocation = KL;
} else {
alert("Stop using IE");
initialLocation = northpole;
}
map.setCenter(initialLocation);
}
}
google.maps.event.addDomListener(window, "load", initialize);
function loadMarker(){
var page = new Date().getTime();
$.ajax({
url:"js/datatesting.xml",
dataType: 'xml',
cache: false,
data: {page: page},
success: onLoadMarker
});
console.log("loadMarker is running" )
};
function onLoadMarker(data){
$(data).find("merchantMarker").each(function(){
places.push({
URL_html:""+$(this).find('merchantProfileUrl').text()+"",//mapshop profile url
tooltip_html:
"<div id='tooltips'>\n\
<div class='cover' style='background-image:url(image/default.jpg);'>\n\
<table style='margin-left:20px;'>\n\
<tr>\n\
<td><img class='photo img-circle' src='"+$(this).find('merchantProfilPicture').text()+"'>\n\
</td>\n\
</tr>\n\
<tr>\n\
<th class='text-center'><p>\n\
"+$(this).find('merchantName').text()+"\n\
</p></th>\n\
</tr>\n\
</table>\n\
</div>\n\
<div class='status'>\n\
<p>"+$(this).find('merchantAboutUs').text()+"</p>\n\
</div>\n\
</div>",
icon_html:''+$(this).find('merchantMapMarker').text()+'', //mapshop marker
position:{lat:$(this).find('merchantLat').text(), lng:$(this).find('merchantLon').text()} // shop lat and lon
});
});
console.log('onLoadMarker is running')
};
$(document).ready(function(){
$('#findout').click(function(){
$('#suggestion').hide();
$('#function_stream').hide();
$('#function_me').hide();
$('#function_findout').show();
});
loadMarker();
refresh();
});
我得到这个错误(不删除markercluster
)
对不起,我别无选择,只能在 StackOverFlow 上问这个问题。