Javascript markercluster导致的Google地图错误

Javascript markercluster导致的Google地图错误,javascript,jquery,google-maps-api-3,Javascript,Jquery,Google Maps Api 3,嗨,伙计们,我有一些问题,我不明白为什么,我试过谷歌我得到的错误,但它没有帮助。似乎是我的markercluster导致了这个问题,但我确实在其他应用程序中尝试过,它工作得非常好。我试过删除 var markerCluster = new MarkerClusterer(map, markers); 但我还有一个错误,那就是 未捕获的TypeError:无法读取 未定义 HTML <script src="https://ajax.googleapis.com/ajax/libs/jqu

嗨,伙计们,我有一些问题,我不明白为什么,我试过谷歌我得到的错误,但它没有帮助。似乎是我的
markercluster
导致了这个问题,但我确实在其他应用程序中尝试过,它工作得非常好。我试过删除

var markerCluster = new MarkerClusterer(map, markers);
但我还有一个错误,那就是

未捕获的TypeError:无法读取 未定义

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();
});
var标记=[];
var places=Array();
函数createTooltip(标记、键){
//创建工具提示
变量工具提示={
马克:马克,
内容:places[key]。工具提示\u html,
cssClass:'tooltip'//要应用于工具提示的css类的名称
};
变量工具提示=新工具提示(工具提示选项);
}
函数刷新(){
setInterval(函数(){
loadMarker();
},5000);
};
函数初始化(){
var初始位置;
var northpole=newgoogle.maps.LatLng(90105);
var KL=新的google.maps.LatLng(3.1597101.7000);
var browserSupportFlag=新布尔值();
var映射;
var标记;
var映射选项;
var mapDiv=document.getElementById(“映射画布”);
如果(位置、长度){
映射选项={
中心:新google.maps.LatLng(3.1597101.7000),
maxZoom:21,
缩放:17,
disableDefaultUI:true,
mapTypeId:google.maps.mapTypeId.ROADMAP,
mapTypeControl:true,
mapTypeControlOptions:{
样式:google.maps.MapTypeControlStyle.DROPDOWN_菜单,
位置:google.maps.ControlPosition.TOP_左
}
};
map=新的google.maps.map(mapDiv,mapOptions);
for(var键输入位置){
(功能(myPlace){
如果(我的位置){
如果(myPlace.icon_html!=''){
变量图标={
url:myPlace.icon_html,
来源:新google.maps.Point(0,0),
主播:新谷歌地图点(8,41)
};
var阴影={
url:“image/shadow.png”,
来源:新google.maps.Point(0,0),
主播:新谷歌地图点(8,41)
};
}否则{
变量图标={
url:“image/default.png”,
来源:新google.maps.Point(0,0),
主播:新谷歌地图点(8,41)
};
var阴影={
url:“image/shadow.png”,
来源:新google.maps.Point(0,0),
主播:新谷歌地图点(8,41)
}; 
}
var marker=new google.maps.marker({
地图:地图,
影子:影子,
url:myPlace.url\u html,
图标:图标,
位置:新的google.maps.LatLng(myPlace.position.lat,myPlace.position.lng)
});
标记器。推(标记器);
创建工具提示(标记、键);
google.maps.event.addListener(标记'click',函数(){
setAnimation(google.maps.Animation.BOUNCE);
setTimeout(function(){marker.setAnimation(null);},2000);
openNewBackgroundTab(marker.url);
}); 
函数openNewBackgroundTab(url){
var a=document.createElement(“a”);
a、 href=url;
var evt=document.createEvent(“MouseEvents”);
//initMouseEvent的第十个参数设置ctrl键
evt.initMouseEvent(“单击”,真,真,窗口,0,0,0,0,
真、假、假、假、0、空);
a、 调度事件(evt);
}
}
})(地点[关键]);
}
}
var markerCluster=新的MarkerClusterer(地图、标记);
//尝试W3C地理定位(首选)
if(导航器.地理位置){
browserSupportFlag=true;
navigator.geolocation.getCurrentPosition(函数(位置){
initialLocation=new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
var marker=new google.maps.marker({
位置:初始位置,
图标:“image/user.png”,
标题:“你在这里!”
});
$('#findout')。on('显示',函数(e){
google.maps.event.trigger(映射,'resize');
marker.setMap(map);
地图设置中心(初始位置);
});
},函数(){
handleNoGeolocation(浏览器支持标志);
});
}
//浏览器不支持地理位置
否则{
browserSupportFlag=false;
handleNoGeolocation(浏览器支持标志);
}
函数handleNogeLocation(errorFlag){