0

我正在爲Google手機創建網站,並在Google地圖上顯示來自數據庫的1000多個標記,但是當我將街景圖標拖動到地圖,移動版Safari和移動Chrome時兩者都崩潰。谷歌街景已損壞,標記太多

如果我將標記限制爲10,它可以正常工作。

我不知道問題是什麼。這裏是我的代碼:

function initialize() { 
var myOptions = { 
    zoom: 17, 
    zoomControl:true, 
    mapTypeControl: true, 
    streetViewControl: true, 
    overviewMapControl: true, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 
map = new google.maps.Map(document.getElementById("map-canvas"), myOptions); 
getLocation(); 

var infoWindow = new google.maps.InfoWindow(); 
google.maps.event.addListener(map, 'click', function() {infoWindow.close();}); 

<?php 
    for($i = 0; $i < count($places); $i++) { 
     ?> 
     var marker<?=$i?> = new google.maps.Marker({ 
     position: new google.maps.LatLng(<?=$places[$i]->coordinates?>), 
     map: map, 
     }); 

     google.maps.event.addListener(marker<?=$i?>, 'click', function() { 
        infoWindow.setContent(""); 
        infoWindow.open(map,marker<?=$i?>); 
      map.panTo(marker<?=$i?>.getPosition()); 
     }); 
    <?php 
    } 
?> 

function getLocation() { 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(showPosition, showError, { timeout: 3000, enableHighAccuracy: true, maximumAge: 90000 }); 
    } 
    else { 
     alert("Geolocation is not supported by this browser."); 
    } 
} 
function showPosition(position) { 
    var currentLocation = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
    map.setCenter(currentLocation); 
    var marker = new google.maps.Marker({ 
     position: currentLocation, 
     map: map 
    }); 
} 
function showError(error) { 
    alert(error.message); 
} 
} 
+0

的問題是,你使用太多的標記。你爲什麼需要這麼多? – Andy

+0

是移動Safari和移動Chrome嗎?聽起來你內存不足 - 無論如何,1000可能無法從UI角度使用。 – halfer

+0

是的,它是移動的Safari和Chrome。感謝您的評論。我在世界各地展示地點,但是我可以將這些地方減少到訪問者所在的城市。 – Boldizsar

回答

1

聚集你的標記可以是一個解決方案。然後例如用php創建一個json,並用javascript加載它。

https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/examples.html

https://developers.google.com/maps/articles/toomanymarkers

這個例子將在地圖上顯示100個標記。

var center = new google.maps.LatLng(37.4419, -122.1419); 
var options = { 
    'zoom': 13, 
    'center': center, 
    'mapTypeId': google.maps.MapTypeId.ROADMAP 
}; 

var map = new google.maps.Map(document.getElementById("map"), options); 

var markers = []; 
for (var i = 0; i < 100; i++) { 
    var latLng = new google.maps.LatLng(data.photos[i].latitude, 
     data.photos[i].longitude); 
    var marker = new google.maps.Marker({'position': latLng}); 
    markers.push(marker); 
} 
var markerCluster = new MarkerClusterer(map, markers); 

希望它有助於