Created
July 23, 2019 17:29
-
-
Save amirkhan81/8b1a1b1c438742898cba4c2718c2dc97 to your computer and use it in GitHub Desktop.
// source https://jsbin.com/nuwem/1
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!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 { height: 90%; width: 90% } | |
</style> | |
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> | |
<!--script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script--> | |
<script type="text/javascript"> | |
function initialize() { | |
var center = new google.maps.LatLng(51.5120, -0.12); | |
var mapOptions = { | |
center: center, | |
zoom: 14, | |
mapTypeId: google.maps.MapTypeId.ROADMAP | |
}; | |
var map = new google.maps.Map(document.getElementById("map"), | |
mapOptions); | |
var circle = new google.maps.Circle({ | |
center: center, | |
radius: 300, | |
strokeColor: "#E16D65", | |
strokeOpacity: 1, | |
strokeWeight: 3, | |
fillColor: "#E16D65", | |
fillOpacity: 0 | |
}); | |
circle.setMap(map); | |
var direction = 1; | |
var rMin = 150, rMax = 300; | |
setInterval(function() { | |
var radius = circle.getRadius(); | |
if ((radius > rMax) || (radius < rMin)) { | |
direction *= -1; | |
} | |
circle.setRadius(radius + direction * 10); | |
}, 50); | |
} | |
google.maps.event.addDomListener(window, 'load', initialize); | |
</script> | |
</head> | |
<body> | |
<div id='map'></div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment