+ Start a Discussion
Anchal gargAnchal garg 

can't be able to show google map on the basis of longitude and lattitude using geolocation

hi ,

 

I am quite new to salesforce and i am trying to create mobile appliction that uses html5 geolocation facility .

i am succedded in getting the lattitude and longitude information of the device from which the app is called. but unable to locate that device position in google map by providing its lattitude and longitude position .

 

also i wanna to use the reverse geocoding feature of google map i.e to display appropriate address of the device by providing its lattitude and longitude information.

 

can anyone help me in this scenario.

 

JaggyJaggy

Hi Anchal,

 

Welcome to Salesforce!

 

How do we know your mistake if you don't share your code with us. Please share your code.

 

Here is the link for reverse geocoding:- http://code.google.com/apis/maps/documentation/geocoding/

 

 

Anchal gargAnchal garg

hi jagdeep ,

 

thanks for your response.

here is snippet of my code : 

 

// code snippet from test.js (jquery file)

$j('#Locatebutton').click(function() {    

// where lacatebutton is the id of the button upon click of which following function execute
alert('Trying to locate your Position!!!!!!!');

if(navigator.geolocation)
{
alert('hi');
navigator.geolocation.getCurrentPosition(function(position){
var lat=position.coords.latitude;
var lan=position.coords.longitude;

var accuracy= position.coords.accuracy;
var time=new Date(position.timestamp);

alert("latitude ="+lat +"\n longitude = "+lan);
$j('#latid').html(lat);
$j('#lonid').html(lan);
$j('#accu').html(accuracy);
$j('#time').html(time);

alert('mapping this info to map!!!!!!!!');
//var image_url="http://ongopongo.com/maps/embed.php?z=14&la="+position.coords.latitude+"&lo="+position.coords.longitude+"&h=500&w=500&msid=AIzaSyBpzsDx8YK3EuCerok3HCpGRiWeM60UtqM&type=G_NORMAL_MAP&b=yes&markers=color:green";
var image_url="http://maps.google.com/?q=28.46385,77.017838&ie=UTF8&t=m&z=14&ll=28.46385,77.017838&output=embed";


prompt('--image url---'+image_url,'hi'+image_url);
$j("#map").remove();
$j('#mapholder').append(

 

 


$j(document.createElement("iframe")).attr("src",image_url).attr('id','map').attr('style','width: 524px; height: 524px;')


);

 

});

 

//in vf page 

 

 

<div id="mapholder">

 

note : however if i use 

var image_url="http://ongopongo.com/maps/embed.php?z=14&la="+position.coords.latitude+"&lo="+position.coords.longitude+"&h=500&w=500&msid=AIzaSyBpzsDx8YK3EuCerok3HCpGRiWeM60UtqM&type=G_NORMAL_MAP&b=yes&markers=color:green";

 

 

code works fine...

 

can u please tell me what am i doing wrong in the code....

 

also by using this i am just able to show location in google map ..

 

but can't able to track it's physical address   (reverse geocoding)??

 

any help in this scenario would be much appreciated........

 

 

thanks ....

 

Anchal Garg

anchal56.er@gmail.com

 

 

JaggyJaggy

Anchal,

 

Can you pls try my approach

1. Include 

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

 

2. For getting geolocation

//Load Google Map
var latlng = new google.maps.LatLng(mylat, mylong);
    var myOptions = {
      zoom: 15,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.HYBRID
    };
   
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

//Add marker
var marker = new google.maps.Marker({
	     position: latlng, 
	     map: map, 
	     title:"You are here"
	 });

 3. For reverse geocoding please check link I provided in last email

 

 


Anchal gargAnchal garg

Hi Jagdeep ,

 

Thanks for your response.

I tried your code.But it isn't working in my mobile app. however it doesn't produce any kind of error or something. but it doesn't show the physical address of a location . can you give me the complete code for this (vf+jquery code) that can display the physical address of a location using any lattitude and longitude information .

 

 

Thanks and Regards 

----------------------------

 

Anchal Garg

anchal56.er@gmail.com

 

 

JaggyJaggy

Anchal,

 

Have a look over following link http://jquery-ui-map.googlecode.com/svn/trunk/demos/jquery-google-maps-mobile.html

It might help you in acheiving what you want.

Anchal gargAnchal garg

thanks jagdeep ..

 

this link helps me a lot . i found solution to my query .

 

thanks again for your help.. :)