Google Maps Javascript API移动性能问题

我正尝试使用Google Maps Javascript API v3构建移动应用程序。从功能上来说，它表现不错，但中间件Android设备的性能表现仍然很差（使用三星Galaxy 3进行测试）。我也检查了官方http://maps.google.com的表现，结果相同，并且使用first example code也是如此。是否有任何移动特定步骤，我可能错过了（请参阅示例代码），或者JavaScript API性能仅限于此级别，并且在这种情况下构建本机应用程序无法避免？Google Maps Javascript API移动性能问题

非常感谢您的答案！

这里是链接页面的代码：

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

来源

2012-01-13 Zenima

很想看到这个问题的答案！ – the0ther 2012-06-23 09:09:41

你有没有尝试把你的脚本和底部？ – 2012-06-25 13:53:19

我认为使用它的性能不如使用原生应用的性能好，但我无法向您证明。这更像是一种观点而不是回答。祝你好运！ :) – Leaudro 2012-06-26 14:12:58

按official documentation，你的代码是正确的。并且地图被优化。

我建议：

尝试在页面的结束脚本URL更改为http://maps.googleapis.com/maps/api/js?sensor=false
加载脚本。

例子：

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

了试用演示在http://fiddle.jshell.net/tomasdev/8FhYz/show/light/ - 我在关于您的设备疑问。如果官方演示运行缓慢，我不认为有一个很好的解决方案。

来源

2012-06-29 06:00:41

谷歌地图的性能很大程度上取决于整个页面的结构有多好。

最大的性能命中通常来自页面的重绘/渲染周期 - 由瓦片加载/卸载引起的。

取决于地图的放置方式以及使用方法，使用position：fixed将地图元素放置在文档流中是一个好处。位置：绝对也可以帮助，但不如“固定”。

来源

2017-08-18 08:13:52

Google Maps Javascript API移动性能问题

回答

相关问题