Eric Leroyer
Posts: 0
Joined: Mon Sep 08, 2014 1:45 pm

Show multiple GPS coordinates on map

Hi Guys,

I'm trying to pull Longitude and Latitude data from seperate columns located in a database collection call locations, then convert these into markers on a googlemap. The difficulty I'm having is only returning the results within a certain radius of the current users location.

I have sucessfully created a button to get the location and input into text fields, I have also got a data service called getcords for the locations_Location_list_service but not sure where to go from here.

Any help would be appreciated

Image Image

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

Show multiple GPS coordinates on map

Hello Eric,

Could you please clarify, have you read our tutorial: http://devcenter.appery.io/tutorials/... ?

Eric Leroyer
Posts: 0
Joined: Mon Sep 08, 2014 1:45 pm

Show multiple GPS coordinates on map

Yes, however this tutorial implies that you have an address but In my situation I have longitude and latitude coordinates with the complexity of introducing a defined radius. I have also read the article on returning customers based on there location and radius defined by the user but was unable to get the 2 to work.

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Show multiple GPS coordinates on map

Hi Eric,

Please follow these steps:

1 add Location-list service to the page.

2 invoke this service on page load.

3 open page in "data" mode.

4 open "Event" bottom panel.

5 add "Success" event handler for datasource from 1step.

6 populate it with following code:

pre

//Were "multiGoogleMap" is map component name.
var map = Appery("googlemap_1").options.mapElement.gmap('get', 'map');

Code: Select all

 var CreateMarker = function(data){ 
     console.log("add marker with coordinates = " + data.lat + " = " + data.long); 
     var marker = new google.maps.Marker({ 
         position: new google.maps.LatLng(data.lat, data.long), 
         map: map 
     });         
 }; 

 for (var i = 0; i < data&#46;length; i++) 
     &#47;&#47;In this function you should to pass latitude, longitude and text to display in infowindow&#46; 
     CreateMarker({lat: data[i]&#46;Lat, long: data[i]&#46;Lng, location:  "SomeData"}); 

/pre

See details: http://prntscr.com/4l22lt/direct

That's all.

Regards.

Eric Leroyer
Posts: 0
Joined: Mon Sep 08, 2014 1:45 pm

Show multiple GPS coordinates on map

Thats great, it worked right away.

Thankyou once again, I think allot of people will find this use full when they have coordinates apposed to address's that needto be converted first.

Eric Leroyer
Posts: 0
Joined: Mon Sep 08, 2014 1:45 pm

Show multiple GPS coordinates on map

Hi Yurri,

I have used the above code which works great in the browser and in the testing app however when I try to export to a apk I get 10 syntax errors on the code above:

Image

I have tried to understand where the error's are however everything I alter seems to cause error with something else.

Cheers Eric

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Show multiple GPS coordinates on map

Hi Eric,

This is JS compressor errors.

Please provide us your app public link we need to take a look on it.

Regards.

Eric Leroyer
Posts: 0
Joined: Mon Sep 08, 2014 1:45 pm

Show multiple GPS coordinates on map

Hi Yurri,

Please find the link below then click on Report Map in the top right, upon clicking on Show Radars, Show Sighting, Show Incidents that is when that javascript is run:

http://appery.io/app/mobile-frame?src...

Kind Regards
Eric

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Show multiple GPS coordinates on map

Eric,

Here is correct code for minification:

pre

&#47;&#47;Were "multiGoogleMap" is map component name&#46;

Code: Select all

 var map = Appery("googlemap_11")&#46;options&#46;mapElement&#46;gmap('get', 'map'); 

 var CreateMarker = function(data){ 

     console&#46;log("add marker with coordinates = " + data["lat"] + " = " + data["long"]); 

     var marker = new google&#46;maps&#46;Marker({ 

         position: new google&#46;maps&#46;LatLng(data["lat"], data["long"]), 

         map: map 

     });         

iconFile = 'http:&#47;&#47;maps&#46;google&#46;com/mapfiles/ms/icons/red-dot&#46;png';
marker&#46;setIcon(iconFile);

Code: Select all

 }; 

 for (var i = 0; i < data&#46;length; i++) 

     &#47;&#47;In this function you should to pass latitude, longitude and text to display in infowindow&#46; 

     CreateMarker({"lat": data[i]["Lat"], "long": data[i]["Lng"], location:  "SomeData"}); 

/pre

Regards.

Eric Leroyer
Posts: 0
Joined: Mon Sep 08, 2014 1:45 pm

Show multiple GPS coordinates on map

Hi Yurri,

Thats worked exactly as expected, I must say the support team for appery.io is very efficient and really know there stuff. You guys certainly provide excellent support and and will recommend this product to anyone who is designing an app.

Thank you once again.

Regards Eric

Return to “Issues”