Google지도 Javascript API 모바일 성능 문제

Google지도 Javascript API v3을 사용하여 모바일 애플리케이션을 구축하려고합니다. 기능적으로는 정상적으로 작동하지만 미들웨어 Android 기기 (Samsung Galaxy 3를 테스트 용으로 사용)에서 성능이 실제로 느립니다. 나는 또한 공식 http://maps.google.com에 성과를 검사하고, 동일한 결과가 있고, first example code를 또한 사용했다. 어떤 모바일 특정 단계, 내가 놓친 (예제 코드를 참조하십시오) 자바 API 성능이이 수준으로 제한되어 있으며이 경우 네이티브 응용 프로그램을 빌드 할 수 없습니까?Google지도 Javascript API 모바일 성능 문제

답변 해 주셔서 감사합니다. 코드가 맞다, official documentation 당으로

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

스크립트와 하단을 넣으려고 했습니까? –

네이티브 앱만큼 성능이 좋지 않다고 생각하지만, 그 사실을 증명할 수는 없습니다. 그것은 대답보다 더 많은 의견입니다. 좋은 결과 내길 바랄 게! :) – Leaudro

: 여기

는 링크 된 페이지의 코드입니다. 그리고지도가 최적화되었습니다.

내가 제안 :

시도 페이지의 끝에서 http://maps.googleapis.com/maps/api/js?sensor=false
로드 스크립트 스크립트 URL을 변경할 수 있습니다.

예 :

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

Google지도 성능은 전체 페이지 구조가 얼마나 잘 구성되어 있는지에 따라 다릅니다.

일반적으로 가장 큰 성능 저하는 타일의로드/언로드로 인한 페이지의 다시 그리기/렌더링주기에서 발생합니다.

지도가 어떻게 배치되고 사용되는지에 따라 위치 : 고정을 사용하여지도 요소를 배치하고 문서 흐름에서 가져 오는 것이 좋습니다. 직책 : 절대적으로도 도움이 될 수 있지만 '고정 된'정도는 아닙니다.

출처

2017-08-18 08:13:52

Google지도 Javascript API 모바일 성능 문제

답변

관련 문제