2012-01-13 4 views
17

Sto provando a creare un'applicazione mobile utilizzando l'API di Javascript di Google Maps v3. Funzionalmente, sta andando bene, ma le prestazioni sono molto lente sui dispositivi middleware Android (usato Samsung Galaxy 3 per i test). Ho anche controllato la performance sul http://maps.google.com ufficiale, ho avuto lo stesso risultato e utilizzando anche lo first example code. C'è qualche passaggio specifico per il mobile, potrei essermi perso (vedi il codice di esempio), o le prestazioni dell'API di Javascript sono limitate a questo livello e la creazione di un'applicazione nativa non può essere evitata in questo caso?Problema di prestazioni mobile dell'API JavaScript di Google Maps

Grazie mille per le risposte!

ecco il codice della pagina collegata:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map_canvas { height: 100% } 
    </style> 
    <script type="text/javascript" 
     src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE"> 
    </script> 
    <script type="text/javascript"> 
     function initialize() { 
     var myOptions = { 
      center: new google.maps.LatLng(-34.397, 150.644), 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), 
      myOptions); 
     } 
    </script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
    </body> 
</html> 
+0

piacerebbe vedere una sorta di risposta su questo! – the0ther

+0

Hai provato a mettere il tuo copione e il fondo? –

+0

Non penso che sia possibile avere prestazioni pari a quelle di un'app nativa che lo utilizza, ma non posso provarlo. È più come un'opinione che una risposta. Buona fortuna! :) – Leaudro

risposta

8

Secondo official documentation, il codice è giusto. E le mappe sono ottimizzate.

suggerisco:

  1. tenta di modificare l'URL script per http://maps.googleapis.com/maps/api/js?sensor=false
  2. script di carico a fine pagina.

Esempio:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map_canvas { height: 100%; width: 100%; } 
    </style> 
    </head> 
    <body> 
    <div id="map_canvas"></div> 
    <script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script> 
     function initialize() { 
     var myOptions = { 
      center: new google.maps.LatLng(-34.397, 150.644), 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), 
      myOptions); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </body> 
</html> 

provare la demo presso http://fiddle.jshell.net/tomasdev/8FhYz/show/light/ - io sono in dubbio per quanto riguarda il dispositivo. Se le dimostrazioni ufficiali funzionano lentamente, non penso che ci sia una soluzione abbastanza buona.

0

Le prestazioni delle mappe di Google dipendono MOLTO da quanto è strutturata l'intera pagina.

Il più grande calo di prestazioni deriva in genere dai cicli di ridisegno/rendering della pagina, causati dal caricamento/scaricamento dei pannelli.

Dipende dal modo in cui viene posizionata la mappa e da come lo si utilizza, è un vantaggio posizionare l'elemento della mappa utilizzando la posizione: fissa, estraendola dal flusso del documento. Posizione: l'assoluto può anche aiutare, ma non tanto quanto "risolto".