Definitive reference for Google Maps Placemark object - javascript

I am using the following method to reverse geocode a google maps latlng:
[GClientGeocoder.getLocations(address:String, callback:function)][1]
Which states as follows:
As this method requires a call to a Google server, you must also pass a callback method to handle the response. This response will contain a Status code, and if successful, one or more Placemark objects.
Can anyone point me to a definitive reference of what a Placemark object is as it seems to return different attributes for different locations. e.g. sometimes I get a ThoroughfareName and others an AddressLine. I would like to understand if I will always get one or other of them and whether they are interchangeable.

This page is from the Google Maps API documentation, and contains a pretty straightforward explanation of what a Placemark object is.
However, the part you probably want to focus on is where it states what format Google uses for the AddressDetails object in a Placemark, which is xAL (eXtensible Address Language). There is a link to the spec there, which leads to a downloadable schema (xsd file), which essentially defines the entire format. A word of warning: the spec is pretty extensive, but you may not need to worry about a great deal of it for your project.
EDIT:
Apologies for not being allowed to add links to the relevant pages for you.

You have to hunt for it, but Google does in fact have some documentation about Placemarks hidden away.

The contents of the Placemark object do vary based on the data available. I found the best way to work out what I was getting back was to use JSON.stringify to examine the response (for debugging):
function onGeocode (resp)
{
document.getElementById("cd_output").innerHTML = JSON.stringify (resp);
}
This gave me the following results when I GeoCoded an address in Sydney, Australia:
Placemark
{
id, address,
AddressDetails
{
Country, CountryNameCode, CountryName,
AdministrativeArea
{
AdministrativeAreaName,
Locality
{
LocalityName
Thoroughfare { ThoroughfareName }
PostalCode { PostalCodeNumber }
}
}
}
Accuracy,
ExtendedData
{
LatLonBox { north,south,east,west }
Point { coordinates }
}
}

Related

Unexpected token < in JSON at position 0 in overpass api request

I'm using overpass api to fetch informations about hospitals in a certain area.
This is the url I use to get the data:
https://overpass-api.de/api/interpreter?data=[out:json][timeout:25];(node[amenity=hospital](41.862018386633096,12.380561828613283,41.9435317956981,12.612133026123049);way[amenity=hospital](41.862018386633096,12.380561828613283,41.9435317956981,12.612133026123049););out;
Since the hospitals can be also way other than simple nodes, I have to treat them differently so I do this:
fetch(url).then(response => {
return response.json();
}).then(results => {
results.elements.forEach(e => {
console.log('Name '+e.tags["name"])
if(e.type == "way"){
console.log('ID: ' + e.id)
let urlWay = `https://overpass-api.de/api/interpreter?data=[out:json][timeout:25];(way[amenity=hospital](${e.id}););out%20center%20meta;`;
fetch(urlWay).then(response=> {
return response.json()
}).then(result => {
lat = result.elements[0].center["lat"]
lon = result.elements[0].center["lon"]
})
} else {
//get lat lon info normally
}
Then I use lat and lon to put a marker on the map.
The explanation for this is that a "way" does not have a single lat-lon information, but it is formed by several nodes. This is an example:
{
"type": "way",
"id": 107248762,
"nodes": [
1233017145,
1233017732,
1233017520,
1233017183,
1233018290,
2144891055,
1233017895,
1233017145
],
"tags": {
"amenity": "hospital",
"wheelchair": "yes"
}
},
So, to get the lat lon informations, I use the "id" property to get the center of the building, by using the urlWay in the code above, specifying out center meta. I use elements[0] because the array has only one element. You can see an example of output by clicking here.
The problem is that, at some point while fetching the informations about the ways and putting markers on the map, the program stops and gives me the error:
SyntaxError: Unexpected token < in JSON at position 0 in overpass api request
I'm assuming (don't know if I'm right) that there is one of these JSON files I get that is not correctly written, so I'm wondering how can I prevent this exception, maybe by just ignoring a bad formatted file.
EDIT: I've modified the code as proposed by user mmd in the answers and worked correctly, so it probably was an error linked to rate limiting.
The issue is most likely related to rate limiting or other error conditions, in which case you receive an XML formatted error message, albeit the HTTP status code might still be HTTP 200! This message cannot be parsed as JSON string, hence the error message.
In general, your approach to query Overpass API one-by-one is quite inefficient. Instead you can also provide several Ids in one go. It is highly recommended to bundle requests this way, rather than sending one request for each single ID, which severely increases chances to hit rate limiting.
way(id:1000,1002,1003,1004)[amenity=hospital]
In wonder, why you don't use out:center in your original query get get all details on one go.
[out:json][timeout:25];
(node[amenity=hospital](41.862018386633096,12.380561828613283,41.9435317956981,12.612133026123049);
way[amenity=hospital](41.862018386633096,12.380561828613283,41.9435317956981,12.612133026123049););
out center;
After some time the api throws 429 Too Many Requests Error.
Try addind some timeout to your api calls.

Google Places Photo Request returning undefined

I have a horizontal scroll bar, that appears on the map, whenever particular venues are requested via Google Places and markers are placed.
My idea, is to have this horizontal scroll bar display a picture of each returned venue using Google places Photo request. However, the .getUrl() method that Google advises to use, is returning me an 'Uncaught TypeError: undefined is not a function'; although I do receive an array of Objects and each Object has an array of photos.
Here is a part of my code:
for (var i = 0, place; place = venueData[i]; i++) {
if (place.photos) {
var photo = place.photos[0].getUrl({ 'maxWidth': 100, 'maxHeight': 100 });
$('.venues-display').append('<li><div class = venue-picture><img src='+photo+'></div></li>')
}
else {
$('.venues-display').append('<li><div class = venue-picture><img src='+ place.icon + '></div></li>')
}
The error that I get points to the line with getUrl().
venueData variable - is the array of Objects that is returned back from Google Places Text Search.
'.venues-display' - is the class name of my scroll bar.
I am a newbie..and getting desperate, because I can't understand what am I doing wrong.
Pleeease heeeelp
The method .getUrl() only works with the Google Places Library (in other words if you call .PlaceServices), where you do not need to use your API key
new google.maps.places.PlacesService(map)
Otherwise, you need to use this piece of code for getting the photos:
https://maps.googleapis.com/maps/api/place/photo?parameters
At least that's what I understood with reading through the Google docs and using different pieces of code for the same reason

How to obtain instagram pictures from a place consuming instagram API?

I gave a look to instafeed.js. It works good right away, I followed the first docs and got a 20 images sample displaying at web page.
However I really need to obtain pictures from a certain place (city, in my case). Working with Twitter API I used to look for the WOEID for the wanted place. Here it seems to be quite similar.
I read Instagram docs:
DISTANCE Default is 1000m (distance=1000), max distance is 5000.
FACEBOOK_PLACES_ID Returns a location mapped off of a Facebook places id. If used, a Foursquare id and lat, lng are not required.
FOURSQUARE_ID Returns a location mapped off of a foursquare v1 api location id. If used, you are not required to use lat and lng. Note that this method is deprecated; you should use the new foursquare IDs with V2 of their API.
LAT Latitude of the center search coordinate. If used, lng is required.
LNG Longitude of the center search coordinate. If used, lat is required.
FOURSQUARE_V2_ID Returns a location mapped off of a foursquare v2 api location id. If used, you are not required to use lat and lng.
But where the hell can I obtain such ID's for a city. Let's say I want pictures tagged with dinner at Puebla, Mexico. What should I do.
I used this nice site to get an ID from my coordinates: http://maihamakyo.org/etc/locastagram/index.php
Tried this Java Script code then:
var feed = new Instafeed({
get: 'tagged',
location: '46016173',
tagName: 'CLEU',
clientId: '***'
})
feed.run();
but got not the expected result.
As of version 1.3, you can add a filter function to Instafeed.js, to exclude images from the results.
So you should be able to set get: "location", and your locationId, and then filter out any images that don't contain the tag you're looking for:
var feed = new Instafeed({
get: 'location',
locationId: LOC_ID,
// other settings omitted for example
filter: function(image) {
return image.tags.indexOf('TAG_NAME') >= 0;
}
});
feed.run();
Update
The image parameter that gets passed to the filter function is the image data straight from Instagram's API. So you can filter on any criteria you want. Just make sure the function returns true or false:
filter: function(image) {
if (image.tags.indexOf('TAG_NAME') >= 0 && image.filter === "Normal") {
return true;
}
return false;
}
To get an idea of what properties that image object has, check this thread on GitHub.
Looking at the instafeed.js documentation, the option name/key for location should be locationId.
I'm not familiar with the Instagram API, but the instafeed.js documentation hints heavily that get needs to be set to location to use a location ID. So it is very possible you can only search for a tag, or a location, but not both.

google maps geocoding changes

Has anyone noticed that google maps geocoding have changed the variable name of the lat and lng from, Qa and Ra to Pa and Qa.
Does anyone know a reason for this?
Edit: If you're using the Google Maps Geocoding Service, as #hamczu suggests, then you should be getting the results like this:
{
... snip ...
geometry: {
location: LatLng,
... snip ...
}
}
It sounds like you're not using the API methods for the LatLng object, but are instead trying to use its undocumented properties. Your question demonstrates one of the best reasons why this is a Bad Idea - the Google code is compressed and obfuscated, using short, arbitrary variable and property names, and Google may recompress its code at any time, arbitrarily changing these names. What it won't change is the function and attribute names in the published API - that's the whole point of having an API to begin with, and the reason why developers should code against the API, not the "undocumented features" of the currently available code.
So the best approach is to use the documented methods:
var lat = result.geometry.location.lat();
var lng = result.geometry.location.lng();
Otherwise, your code will likely break every time Google recompresses its code.

Using Google Geolocation JSON

I'm trying to use Google Reverse Geocoding, which takes some coordenates and returns a JSON structure with some addresses. My javascript code is like this:
$.getJSON("http://maps.google.com/maps/api/geocode/json?",
{ latlng: myDevice.Lat + "," + myDevice.Lon,
sensor: true},
function (data) {
...
}
)
However, when debugging with firebug, when it gets in the function, it turns out that data is null.
Could someone give me any advice?
Thank you!
You are likely bumping up against the Same-Origin Policy. You have two choices:
Create a server-side proxy to grab the data, then request it via AJAX.
Use the Google Maps API

Categories

Resources