0

我知道我的问题是重复的。但我需要确切的答案。我已将以下 js 用于谷歌地图 api，并且在我的网站上运行良好，但加载需要很长时间。在我的网站上，我在谷歌地图上显示了 100 个标记。

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>

那么谁能告诉我如何提高页面的速度。

谢谢

编辑

function initialize() {
    var secheltLoc = new google.maps.LatLng(43.265305424381985, -88.81882460937499),
        markers,
        myMapOptions = {
            zoom: 7,
            center: secheltLoc,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            panControl: true,
            zoomControl: true,

        },

        map = new google.maps.Map(document.getElementById("map_canvas"), myMapOptions);
    var bounds = new google.maps.LatLngBounds();

    function initMarkers(map, markerData) {
        var newMarkers = [],
            marker;

        for (var i = 0; i < markerData.length; i++) {
            var pos = new google.maps.LatLng(markerData[i][1], markerData[i][2]);
            bounds.extend(pos);
            marker = new google.maps.Marker({
                map: map,
                draggable: false,
                position: markerData[i].latLng,
                animation: google.maps.Animation.DROP,
                icon: markerData[i].logo
            }),
                boxText = document.createElement("div");


            infoboxOptions = {
                content: boxText,
                disableAutoPan: true,
                maxWidth: 0,
                pixelOffset: new google.maps.Size(-140, 0),
                zIndex: null,
                boxStyle: {
                    background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",

                    width: "450px"
                },
                closeBoxMargin: "12px 4px 2px 2px",
                closeBoxURL: "",
                infoBoxClearance: new google.maps.Size(1, 1),
                isHidden: false,
                pane: "floatPane",
                enableEventPropagation: false
            };

            newMarkers.push(marker);
            //define the text and style for all infoboxes
            boxText.style.cssText = "border: 1px solid #333; margin-top: 8px; background:white; color:#FFF; font-family:Arial; font-size:12px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;height:100px; width:350px;";
            boxText.innerHTML = "<div class='mainDiv'><div class='forImg' style='float:left;margin:4px 0 0 3px;'><img src=" + markerData[i].image + " /></div><div style='float:right; width:220px; margin-top:5px; padding-left:10px;'><div class='titleImg'>" + markerData[i].title + "</div><div class='descriptionTool'>" + markerData[i].address + "</div></div></div>";
            //Define the infobox
            newMarkers[i].infobox = new InfoBox(infoboxOptions);
            //Open box when page is loaded
            newMarkers[i].infobox.open(map, marker);
            newMarkers[i].infobox.close();



            marker.set("myZIndex", marker.getZIndex());
            google.maps.event.addListener(marker, 'mouseover', (function (marker, i) {
                return function () {
                    newMarkers[i].infobox.open(map, this);
                    //marker.setIcon(icon1);
                    // styleIcon.set("color","#00ff00");
                    //map.panTo(markerData[i].latLng);
                }
                getHighestZIndex();
                this.setOptions({zIndex: highestZIndex + 1});
            })(marker, i));
            google.maps.event.addListener(marker, 'mouseout', (function (marker, i) {
                return function () {
                    newMarkers[i].infobox.close(map, this);
                    // marker.setIcon(icon2);
                    // map.panTo(markerData[i].latLng);
                }
                this.setOptions({zIndex: this.get("myZIndex")});
            })(marker, i));

        }

        return newMarkers;

    }

    markers = initMarkers(map, [

        { latLng: new google.maps.LatLng(43.072919, -89.402315), title: "xyz", image: 'img.jpg', address: 'xcd'}
 { latLng: new google.maps.LatLng(43.072919, -89.402315), title: "xyz", image: 'img.jpg', address: 'xcd'}
 { latLng: new google.maps.LatLng(43.072919, -89.402315), title: "xyz", image: 'img.jpg', address: 'xcd'}



    ]);

}
4

0 回答 0