Html Codes: GeoLocation Static- See your Current Position on Map (Sattelite, Roadmap and Hybrid)

HTML5 has amazing capability to say where do you sit down on the PC. Yes! It can find you easily unless you don't let it. This really surprises me as 10 years programmer. So now you can have more communication with people around the world in your site. It gives you a picture of street of his living. One of my friend said that, it has 10 degree deviation from the real place for preventing rocketing purpose. It was true about me and showed me in my neighbor's home some distance far away, not mine!
The following code help you to add the GeoLocation map statically to your page with three different views: satellite, road-map and hybrid. Just copy the code and enjoy!

<!-- This Script is from www.html5freecode.com, Coded by: Kerixa Inc-->

<p>
	<select name="Select1" style="width: 102px" onchange="ShowAll()" id="type">
	<option selected="selected" value=" ">Select One</option>
	<option>satellite</option>
	<option>roadmap</option>
	<option>hybrid</option>	
	</select><br>
</p>

<div id="Msg"></div>

<table style="width: 100%">
	<tr>
		<td id="M1">&nbsp;</td>
	</tr>
</table>
<script>

var msg=document.getElementById("Msg")
function ShowAll(){
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(AllMaps,Error)
   	msg.innerHTML= "The GeoLocation loaded successfully!"
   	firsttime= false
    }
  else
  	msg.innerHTML="This browser doesn't support GeoLocation. Try another one . . ."
  	
}

function AllMaps(pos)
{
  var lat= pos.coords.latitude + "," + pos.coords.longitude
  var ind= document.getElementById("type").selectedIndex
  if (ind==0){
  	alert("Select a One Type of Maps") 
  	return
  }
  var type= document.getElementById("type").options[ind].text
  var img1="http://maps.googleapis.com/maps/api/staticmap?center="
  +lat+"&zoom=17&size=390x170&maptype="+type+"&markers=color:blue%7Clabel:S%7C"+lat+"&sensor=false"
  document.getElementById("M1").innerHTML= "<img src='"+img1+"'>"
}

function Error(error)
{
  switch(error.code) 
    {
    case error.PERMISSION_DENIED:
      msg.innerHTML="You don't have permission to view the Map."
      break;
    case error.POSITION_UNAVAILABLE:
      msg.innerHTML="Your location was not undestood."
      break;
    case error.TIMEOUT:
      msg.innerHTML="The procedure took longer than usual."
      break;
    case error.UNKNOWN_ERROR:
      msg.innerHTML="<< Unknown Error >>"
      break;
    }
}
</script>

<div style="text-align: center"><br><font face="Tahoma"><a target="_blank" href="http://www.html5freecode.com"><span style="font-size: 8pt; text-decoration: none">HTML5 Free Code</span></a></font></div>

If you don't know how to use this code or need more information Click here!


	You can leave comments once you sign in/up.

HTML5 Best Codes

Html Codes: GeoLocation Static- See your Current Position on Map (Sattelite, Roadmap and Hybrid)

You can leave comments once you sign in/up.

Review

Links