Google Maps Static Map using place_id as a parameter - javascript

Does anybody know how to use a place_id as a marker location on Static Maps?
In the docs https://developers.google.com/maps/documentation/maps-static/dev-guide#MarkerLocations it does not indicate whether a place_id can be used, but it seems unusual that this would be missing... Google use place_id in most of the other Maps requests.
Thank you

Currently place ID is not supported as location in Static Maps API. There is a feature request in Google issue tracker that you can see at
https://issuetracker.google.com/issues/71012469
Feel free to star this feature request to add your vote and subscribe to notifications. Hopefully Google will implement it in the future.

In the Docs I don't see a way to use the place_id parameter.
You can obtain the coordinates of a place_id and then use them in the required parameter center.
var request = {
placeId: 'ChIJOwE7_GTtwokRFq0uOwLSE9g'
};
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) {
//My URL
var gStaticMapURL = "https://maps.googleapis.com/maps/api/staticmap?center=" + place.geometry.location.lat() + "," + place.geometry.location.lng() + "&zoom=14&size=400x400&key=YOUR_API_KEY";
}
});

Related

How to show the information for the telephone and the website and URL on google map by using InfoWindow?

Using the sample code of google map API as below, I am trying to make my google map application. But, when I search the restaurant and click the marker on the map, I can't see the information for telephone, website and can't get access to the url. What is the solution for showing the information?
Here is the sample code I referred to
https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-hotelsearch?hl=ja
Here is the code I am writing.
https://github.com/takeyan1004/javascript-application/blob/master/grf1218.html
The response of the method textSearch() hasn't the telephone, website or url of a place, you need to make other call to getDetails(place_id) to get that data.
Example:
var places = new google.maps.places.PlacesService(map);
places.getDetails({placeId: marker.placeResult.place_id},
function(place, status) {
if (status !== google.maps.places.PlacesServiceStatus.OK) {
return;
}
infoWindow.open(map, marker);
//place object has the information about phone, webste...
buildIWContent(place);
});

Google Maps Geocode: unknow property premise

I'm trying to add a marker on a building/premise on google maps, to do this I'm using the Geocoding API. I tested it out by requesting an address and it worked perfectly.
var address = "...";
var geocoder = new google.maps.Geocoder();
geocoder.geocode( {'address': address }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var location_marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
}
});
According to the Geocoding API you can request a building/premise by using the premise property, but when using premise I'm getting a JavaScript error Uncaught InvalidValueError: unknown property premise.
This is how I'm requesting the premise property:
var premise = "...";
var geocoder = new google.maps.Geocoder();
geocoder.geocode( {'premise': premise }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var location_marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
}
});
I followed the answer given for this question
Not sure if anyone has had this problem before. Maybe there's another way to tackle this as well.
UPDATE
In case someone stumbles upon this question, to search businesses/places on Google Maps you can use the Places Library. This returns objects with the business's address, location, name etc.
Hopefully this helps someone :)
I there's some confusion here about what the Geocode API does. Read the API again for requests.
The required parameters are address or latlng or components, and sensor.
The optional parameters are bounds, language, region and components.
Premise is one of the properties of the returned JSON data. This means that you can't use it as a search parameter which is why the API is complaining.
The answer in that question to which you linked is wrong.
Hope this is helpful.

Google Maps Marker Not Appearing on Main Map ONLY

I am using the Google Maps api to create a small, stripped down map that shows a geocoded location with a marker. You can see the live code here: http://www.ddbeadworks.com/
It works flawlessly, until someone clicks the Google logo to take themselves to maps.google.com. There, the map is properly zoomed and centered on the location, but the marker isn't being passed to maps.google.com, it seems, as that doesn't appear? I looked through the API, but I can't find anything like "markersToGoogle boolean" or any such variable.
Here is the relevant code section. This is the only place I deal with markers anywhere. JavaScript:
var address = $(this).attr("name");
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, function(results, status) {
var lat = results[0].geometry.location.lat();
var lng = results[0].geometry.location.lng();
if (status == google.maps.GeocoderStatus.OK)
{
var yourStartLatLng = new google.maps.LatLng(lat, lng);
$('#map_canvas').gmap('addMarker', {'position': yourStartLatLng, 'bounds': true});
$('#map_canvas').gmap('option', 'zoom', 14)
$('#map_canvas').gmap('option', 'disableDefaultUI', true)
}
});//close geocoder
That is what the Google logo links to, the main Google Maps web site, with the same center and zoom as the map it came from.
If you want to make a bigger map with your marker on it, you need to link to a bigger Google Maps API v3 based map (and not expect your user to use the "Google" logo).

Google map api & tparkin point-in-poly

I have been working on this site for about a week now. It isnt great but then again I am not great the web design. Any tips on improvements would be greatly appreciated.
Moving on I am having a problem with point in polygon extension that tparkin wrote for the google maps api. I have read through the read me, other post and everything but I can figure out why I keep getting this error ...
a.lat is not a function
[Break On This Error] Ba(I,function(a){return!a?k:this.Z[xb]...{return new Q(this.Z.d,this.aa.d,i)};
I think it might be a problem with me using the functionality of tparkins extension incorrectly but like I said I cant figure out it.
Any help is greatly appreciated in advance.
This is the website with the script problem. Please let me know if you need any additional information.
my website.
I figured out the problem I was having. Check it out.
function codeAddress() {
var address = document.getElementById("address").value;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
var isWithinPolygon = polygon85.containsLatLng(results[0].geometry.location);
alert(isWithinPolygon);
}
else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
So the issues before was that instead of passing the coordinates results[0].geometry.location, I was passing it just location. Its a simple case of me not fully understanding what I was working with. Thank you for everyone that looked into this and sorry I wasted your time.
--Zac

Center Google Map Based on geocoded IP

Basically whenever someones opens up my (Google) map I want it default to their approximate location.
Is there an easy way to do it with Google's API or do I have to write a custom code (this is python based app)?
You can use Google API's built-in ClientLocation object:
if (GBrowserIsCompatible())
{
var map = new google.maps.Map2(document.getElementById("mapdiv"));
if (google.loader.ClientLocation)
{
var center = new google.maps.LatLng(
google.loader.ClientLocation.latitude,
google.loader.ClientLocation.longitude
);
var zoom = 8;
map.setCenter(center, zoom);
}
}
Check out http://www.ipinfodb.com/. You can get a latitude and longitude value by passing their services an IP address. I did something recently where I created a simple service that grabbed the current IP address and then passed it to the service ("api/location/city" is just a service that curls the ipinfodb service). Using jquery:
$.get("api/location/city", null, function(data, textStatus)
{
if (data != null)
{
if (data.Status == "OK")
{
var lat = parseFloat(data.Latitude);
var lng = parseFloat(data.Longitude);
$.setCenter(lat, lng, $.settings.defaultCityZoom);
manager = new MarkerManager(map, {trackMarkers : true });
var e = $.createUserMarker(map.getCenter());
e.bindInfoWindowHtml($("#marker-content-event").html());
var m = [];
m.push(e);
// map.addOverlay(e);
manager.addMarkers(m, 10);
manager.refresh();
}
else
{
$.setCenter($.settings.defaultLat, $.settings.defaultLng, $.settings.defaultZoom);
}
}
}, "json");
The key here is this line:
$.setCenter(lat, lng, $.settings.defaultCityZoom);
Just setting the center to the lat/lng of the result of the service call.
Per the docs, just map.setCenter(new GLatLng(37.4419, -122.1419), 13); or whatever other coordinates. Doing it in the page's Javascript is normally preferred.
If you mean translating an IP to lat and long, I don't think the Google API supports that, but there are other web services that do, such as maxmind, hostip, and many, many others. I don't know which one(s) to recommend -- try out a few, would be my suggestion!
If the user uses FireFox 3.5/google gears, you can retrieve the lat and lng from the browser itself.
You'll find details on another stackoverflow post here
IP Address Geocoding API for Google Maps: http://web3o.blogspot.com/2011/06/ip-address-geocoding-api-for-google.html

Categories

Resources