2017-02-10 1 views
2

온라인/오프라인 상황을 다루는 응용 프로그램이 있습니다. 지금 당장은 응용 프로그램이 처음으로 오프라인으로 실행되어 API가로드되지 않아 빈지도 페이지가 표시되는 경우가 있습니다.Reinitialize/Restart Google Map Api

Google지도 api의 호출은 다음과 같습니다.

<script src="http://maps.google.com/maps/api/js?key=APIKEY"></script> 

나는 이미 내 Google지도 API를 초기화되었는지 여부를 확인 할 내가 어떻게 다시 초기화 할 방법이

document.addEventListener("offline", function() 
{ 
    console.log("in offline event listener"); 

}, false); 

document.addEventListener("online", function() 
{ 
    console.log("in online event listener"); 

}, false); 

같은 것입니다 온라인/오프라인 상태를 다루는 이벤트 리스너를 추가 한 그것?

업데이트 1 : 나는 통해 런타임에 스크립트를 삽입 할 수있어 ,

var script = document.createElement("script"); 
script.setAttribute("type", "text/javascript"); 
script.setAttribute("src", "http://maps.google.com/maps/api/js?key=APIKEY"); 
document.getElementsByTagName("body")[0].appendChild(script); 

하지만 내 다른지도 플러그인의 결과에 구글지도 API 호출의 여러 인스턴스를 발생합니다 작동하지 못한다. 따라서 실패한지도 API 호출을 파괴하거나 Google지도 API가 이미 성공적으로 호출되어 검색되었는지 여부를 확인해야합니다.

답변

2

스크립트를 다시 시작하는 대신 인터넷에 연결되어있을 때만 스크립트를 실행할 수 있습니다. https://www.joshmorony.com/part-3-advanced-google-maps-integration-with-ionic-and-remote-data/

:

key = "YOUR GOOGLE MAP API KEY" 

GoogleMapInit(key); 

function GoogleMapInit(key){ 
    if (key != null){ 
    apiKey = key; 
    } 

    loadGoogleMaps(); 
} 

function loadGoogleMaps(){ 
    window.mapInit = function(){ 
    //Run any code that must be run after Google Map Api is done (E.g loading markers) 
    } 

    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.id = "googleMaps"; 

    if (apiKey){ 
    script.src = 'http://maps.google.com/maps/api/js?key=' + apiKey + '&callback=mapInit'; 
    } 
    else{ 
    script.src = 'http://maps.google.com/maps/api/js?callback=mapInit'; 
    } 
    document.body.appendChild(script); 
} 

또한 참조 할 수 있습니다 :

는 메인 페이지에 자바 스크립트에서

는 index.html 파일 <script>...</script> 요소를 제거