오프라인 일 때 Google Map을 이미지로 바꿉니다.

Question

저는 자바 스크립트에 상당히 익숙하지 않습니다. 연결이 끊어지면 정적 이미지에 Google지도가있는 div를 변경하는 방법이 있는지 궁금합니다. 코드는 위치 추적을 수행하므로지도를 캐싱하는 것은 나에게 쓸모가 없습니다. 지도를 10 초마다 업데이트하는 기능이 있지만 (연결이있을 때만 모바일 Wi-Fi 시스템과 함께 자동차에서 사용됩니다) 오프라인 일 때지도를 이미지로 변경할 수있는 방법이 있습니까? 가시성 및 표시 속성을 사용하여 시도했지만 맵은 그대로 유지됩니다. 내가 오버레이 할 이미지가 ID = "alt_img"

<div id="right_top_div" style="position:absolute; right: 0; width:50%; height:768px; z-index:10; background-color: #FFF" > 
    <img id="show_more_button" src="images/show_more_button.png" style="position:absolute; left:0;top:38%; width:40px; height:150px; z-index: 12" /> 
    <img id="alt_img" style="position:absolute;left:0%;visibility:hidden; z-index:10" src="images/greencab_ad.png" /> 
    <div id="map_canvas" style="position:absolute; right:0; width:100%; height:100%; background-color: #FFF" > 
     <img style="position:absolute;left:48%;top:50%; z-index:1" src="images/ajax-loader.gif" /> 
    </div> 
</div> 

Answer 1

무엇인지 바로 위에지도 (Z- 인덱스)이며, 다음은 그냥 가시성의 조정 것 다른 사업부에서 이미지를 가진 약,

<div id="right_top_div" style="position:absolute; right: 0; width:50%; height:768px; z-index:10; background-color: #FFF" > 
    <div id="not_connected" style="position:absolute; right:0; width:100%; height:100%; z-index:15; display:none;"><img src="image_for_no_connection.png"></div> 
    <img id="show_more_button" src="images/show_more_button.png" style="position:absolute; left:0;top:38%; width:40px; height:150px; z-index: 12" /> 
    <img id="alt_img" style="position:absolute;left:0%;visibility:hidden; z-index:10" src="images/greencab_ad.png" /> 
    <div id="map_canvas" style="position:absolute; right:0; width:100%; height:100%; background-color: #FFF" > 
     <img style="position:absolute;left:48%;top:50%; z-index:1" src="images/ajax-loader.gif" /> 
    </div> 

Answer 2

당신은 정기적으로 저장할 수 있습니다 : 정말 (지도 용량 계산에 포함 할 것과 당신이 반복지도를 다시 초기화하지 않았을 그런 식으로)지도 자체를 변경하지 현재지도의 이미지 :

캔버스 saved_image에는지도의 "스크린 샷"이 포함되어 있습니다. 그것을 함수에 넣고 규칙적으로 호출하십시오. 연결이 끊어지면 대신 연결이 표시됩니다.