hayes/gist:5724622

## gistfile1.html
<html>
<head>
</head>
<body>
  lat:<input type="text" name="lat" value="45.52578"><br>
  lon:<input type="text" name="lon" value="-122.683672"><br>
  <img src="">

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
  <script type="text/javascript">
    $('input').change(function() {
      var lat = $('input[name=lat]').val()
        , lon = $('input[name=lon]').val()
        , params = {}
        , src = "http://maps.googleapis.com/maps/api/staticmap?"

      params.center = lat+','+lon
      params.zoom = 14
      params.size = "640x400"
      params.sensor = false
      params.key = "AIzaSyDt_zIeamTVIOeyvbUgCEEeQ-w6g5h4gGA"
      params.visual_refresh = "true"
      params.markers = params.center

      src += Object.keys(params).map(function(key) {
        return key+'='+params[key]
      }).join('&')

      $('img').attr('src', src)

    }).change()
  </script>
</body>
</html>
	<html>
	<head>
	</head>
	<body>
	lat:<input type="text" name="lat" value="45.52578"><br>
	lon:<input type="text" name="lon" value="-122.683672"><br>
	<img src="">

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
	<script type="text/javascript">
	$('input').change(function() {
	var lat = $('input[name=lat]').val()
	, lon = $('input[name=lon]').val()
	, params = {}
	, src = "http://maps.googleapis.com/maps/api/staticmap?"

	params.center = lat+','+lon
	params.zoom = 14
	params.size = "640x400"
	params.sensor = false
	params.key = "AIzaSyDt_zIeamTVIOeyvbUgCEEeQ-w6g5h4gGA"
	params.visual_refresh = "true"
	params.markers = params.center

	src += Object.keys(params).map(function(key) {
	return key+'='+params[key]
	}).join('&')

	$('img').attr('src', src)

	}).change()
	</script>
	</body>
	</html>