2012-01-13 10 views
17

Estoy intentando crear una aplicación móvil utilizando Google Maps JavaScript API v3. Funcionalmente, está yendo bien, pero el rendimiento es muy lento en dispositivos middleware Android (se usa Samsung Galaxy 3 para probar). También verifiqué el rendimiento en el http://maps.google.com oficial, tuve el mismo resultado y también usé el first example code. ¿Hay algún paso específico para dispositivos móviles que podría haber omitido (vea el código de ejemplo), o el rendimiento de la API de Javascript está limitado a este nivel, y no se puede evitar la creación de una aplicación nativa en este caso?Problema de rendimiento móvil de Google Maps JavaScript API

¡Muchas gracias por las respuestas!

Este es el código de la página enlazada:

<!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

Me encantaría ver algún tipo de respuesta en este caso! – the0ther

+0

¿Intentó poner su guión y el final? –

+0

No creo que sea posible tener un rendimiento tan bueno como el de una aplicación nativa al usarlo, pero no puedo demostrárselo. Es más como una opinión que una respuesta. ¡Buena suerte con eso! :) – Leaudro

Respuesta

8

Según official documentation, su código es correcto. Y los mapas están optimizados.

sugiero:

  1. intenta cambiar la URL de secuencia de comandos para http://maps.googleapis.com/maps/api/js?sensor=false
  2. guiones de carga al final de la página.

Ejemplo:

<!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> 

probar la demo a cabo a http://fiddle.jshell.net/tomasdev/8FhYz/show/light/ - Estoy en duda en cuanto a su dispositivo. Si las demostraciones oficiales funcionan lentamente, no creo que haya una solución bastante buena.

0

El rendimiento de Google maps depende MUY de lo bien estructurada que esté toda la página.

El mayor golpe de rendimiento generalmente proviene de los ciclos de repintar/renderizar de la página, causados ​​por la carga/descarga de los mosaicos.

Dependiendo de cómo se coloca el mapa y cómo lo usa, es una ventaja posicionar el elemento del mapa usando la posición: fijo, quitándolo del flujo de documentos. Posición: absoluta también puede ayudar, pero no tanto como 'fijo'.

Cuestiones relacionadas