public
Last active

  • Download Gist
gistfile1.html
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
<button id='stop'>stop</button>
<button id='start'>start</button>
<div id='count'></div>
<div id="shell">
</div>
<script
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyA_OZRpMaskOiOyodu5PQSbFKrY5hjFRxY&sensor=false"></script>
<script>
var mapMarkup = '<div id="map" style="width: 200px; height: 200px;">loading</div>';
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var makeMap = function(){
window.mapInstance = new google.maps.Map(document.getElementById("map"), myOptions);
c += 1;
document.getElementById("count").textContent = c;
};
var c = 0;
var loop = false;
 
document.getElementById("start").onclick = function(){
if (!loop){
// every second, either make or hide the map
loop = setInterval(function(){
if (document.getElementById("map")){
document.getElementById("shell").innerHTML = '';
delete window.mapInstance;
} else {
document.getElementById("shell").innerHTML = mapMarkup;
makeMap();
}
}, 100);
}
};
 
document.getElementById("stop").onclick = function(){
if (loop){
clearInterval(loop);
console.log('stopped after: ' + c);
}
};
 
</script>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.