Google places API using Http_get().

[Michael1954]

I am trying to get "THINGS" from google places API. My problem is when I am in a large town or not in a town. I need to pass the Lat Lng.

I am thinking Http_get(). The URL I am using is of this format with a key at the end. ( License_key)


https://maps.googleapis.com/maps/api...tion=51.373810, 0.452608&radius=10000&types=bar&key=License_key



Steve Wood mentioned this example because the site is Https

http_get("https://www.sqst.com","",443,0,.f.,.f.)

Once I get the object I can use a list control to display it.

My question is can someone explain in very simple steps what I need to do. I need to build the URL in xbasic as I would rather keep the key hidden.

I would like to have {dialog.object}._places returned.


JSON Places.png


Sorry David I am using 12.4.3.1 build 3962

[peteconway]

Re: Google places API using Http_get().

The list control can return both the lat,lng on the map without your process. Video UXL_V12_58 as a starting point.

[Davidk]

Re: Google places API using Http_get().

Not sure I understand what you're wanting to do... even though you've said. You want to create the URL in XBasic? You want to build a string for the URL? Do you want to use http_get... or not? You also write that you want the returned JSON going into a namespace variable. So... what's the issue?

[Michael1954]

Re: Google places API using Http_get().

Sorry

I am trying to use Google places.

https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=51.373810, 0.452608&radius=10000&types=bar&key=License_key

https://maps.googleapis.com/maps/api/place/nearbysearch/json? I am asking for Json back.

location=51.373810, 0.452608 I have found my location from the phone.

&radius=10000 within a radius of 10,000 mtrs.

&types=bar I want all bars returned.

As you can see from my picture (above) Google returns a complex JSON object that Alpha allows me to format. If I put this object in a list I can display it on the phone.
After I have all of the bars, car parks, atm's in the list I can show people where they are on a map.

Google also returns the place Id.
Google has code for this that works in small towns but in larger towns, it gives a very focused data set. So with this URL, I can tell Google my position. Obviously the URL needs to be dynamic.

Location changes
Types changes (atm, bars etc)
radius will be smaller in a city centre than on a motorway.

I have no idea how to furnish Google with my URL and then how to get the returned JSON into a JavaScript variable.

[peteconway]

Re: Google places API using Http_get().

re: &radius=10000 within a radius of 10,000 mtrs etc. This is a standard setting in the Lists search.... I think your are just taking a difficult and unnecessary path.

[Michael1954]

Re: Google places API using Http_get().

Does Alpha support places? The places API is a separate API.

Loading the library

The Places service is a self-contained library, separate from the main Maps JavaScript API code. To use the functionality contained within this library, you must first load it using the libraries parameter in the Maps API bootstrap URL:

I have seen no reference to support for anything but the maps API.

[Davidk]

Re: Google places API using Http_get().

I'm a little confused... but... I believe this is what you're looking for. Ajax Callback, with Location information, to call Google Places and return that data to a List.

Ajax Callbacks include the option to pass through location information into e.__locationLatitude and e.__locationLongitude... so that's all good.

Use that location data in the Google Places call. Returned results include JSON in a .body property.

Set up a List Control for data coming from a Javascript function. The Javacsript function will process the Places JSON picking out what you want to show.

The attached example doesn't go into more detail than just a straight List... however... this could get interesting because the Places JSON is a hierarchy and the List control can handle that very nicely.

There is a button on the attached example (remember to put your Google Key into the XBasic function) which calls the XBasic function getPlaces... passing in location info...

function getPlaces as c (e as p)
	

debug(1)

dim url as c

dim latLng as c
if variable_exists("e.__locationLatitude") then
	latLng = e.__locationLatitude + "," + e.__locationLongitude	
else
	latLng = "51.373810,0.452608"
end if

url = "https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=" + latLng + "&radius=10000&types=bar&key=your key here"	

dim result as p
result = http_get(url,"",443,0,.f.,.f.)

getPlaces = "{dialog.Object}.__places=" + result.body + ";{dialog.object}.refreshListData('listPlaces');"

	
end function

Return the Places JSON in a namespace variable and refresh the List control.

The List control data source is a Javascript function...

function showPlaces(){

	if({dialog.Object}.__places==undefined){
		return '';
	}else{
		var listData = [];
		for(i=0;i<{dialog.Object}.__places.results.length;i++){
			var listRow = {};
			listRow.name = {dialog.Object}.__places.results[i].name;
			listRow.lat = {dialog.Object}.__places.results[i].geometry.location.lat;
			listRow.lng = {dialog.Object}.__places.results[i].geometry.location.lng;
			listData.push(listRow);
		}
		return listData;
	}

}

This takes the Places data... picks out the Name, Lat, Lng... builds an array of objects and returns that to the List... resulting in...

Google_Places_List.PNG

ux_Google_Maps_Places_API_Test.a5wcmp

[Michael1954]

Re: Google places API using Http_get().

Thanks David,

I will try it and report back.

[Michael1954]

Re: Google places API using Http_get().

Thanks David

It works, there was a small typo.

dim url as

Should read

dim url as c

debug(1) found that.

My first try I was so excited I forgot my license key.


So edit the dim url statement and enter your license key and you have a working places search.

Permissible types are documented here

https://developers.google.com/places...upported_types

[peteconway]

Re: Google places API using Http_get().

David has given you a great jump start on this, just follow his advice. You need to use the latest build if you want to use markers in the List, you can get an idea of the kind of things possible in this quick Video.

https://www.screencast.com/t/X0KGbUhi

[Michael1954]

Re: Google places API using Http_get().

Thanks Pete,

I will post back when I have something interesting.

I want to use English in a dropdown so I need to translate the American types into readable English, but Alpha lets me do that.
I also want to change the radius of the search and then finally from the places Id display the google map info available.

Places Id.png

If you look carefully you will see under the icon Google is telling me I am 37 minutes away.

My users will be able to navigate to booking.com etc for a price.

Point of interest I was living in Brighton when the IRA bombed the Grand in an attempt to kill Maggie T.

[peteconway]

Re: Google places API using Http_get().

Don't forget if you use controls like the slider to select distance (or zoom) you need to return a number value the the map EG. var range = number(distance) - you get the idea.
Go for it mate!

[Davidk]

Re: Google places API using Http_get().

Thanks Michael, that's fixed in the post... I wrecked it in my posting cleanup.

[Michael1954]

Re: Google places API using Http_get().

If my code was that problem free I could retire.

Just got a code sample in the form

function initialize() {

var map = new google.maps.Map(document.getElementById('map'), {
center: new google.maps.LatLng(-33.8665433, 151.1956316),
zoom: 15
});

var request = {
placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4'
};

var infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);

service.getDetails(request, function (place, status) {

if (status == google.maps.places.PlacesServiceStatus.OK) {

var marker = new google.maps.Marker({
map: map,
position: place.geometry.location
});

google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
}
});
};

Added to your code to get

var listRow = {};
listRow.name = {dialog.Object}.__places.results[i].name;
listRow.vicinity = {dialog.Object}.__places.results[i].vicinity;
listRow.place = {dialog.Object}.__places.results[i].place_id;
listRow.lat = {dialog.Object}.__places.results[i].geometry.location.lat;
listRow.lng = {dialog.Object}.__places.results[i].geometry.location.lng;
listData.push(listRow);

Now I have the postal address and the Place_Id with the place Id I can help clients find hotel prices with out learning a host of Hotel API's

[Michael1954]

Re: Google places API using Http_get().

I have found the reference in David's code.

With this, I have got the place details I wanted.

This is Selwyn's component modified


ajaxcallback_crossdomain.a5wcmp

At the moment I am struggling with a cross domain callback

var listData = [];
for(i=0;i<{dialog.Object}.__places.results.length;i++){
var listRow = {};
listRow.name = {dialog.Object}.__places.results[i].name;
listRow.vicinity = {dialog.Object}.__places.results[i].vicinity;
listRow.place = {dialog.Object}.__places.results[i].place_id;
listRow.lat = {dialog.Object}.__places.results[i].geometry.location.lat;
listRow.lng = {dialog.Object}.__places.results[i].geometry.location.lng;
listRow.reference = {dialog.Object}.__places.results[i].reference;

listData.push(listRow);
}
return listData;

Note reference comes from here.

So this saves me going through the complexity of Place_Id