One question: How to implement GEO search tip as www.airbnb.com has?
When I start writing "Lond.." it auto-suggests "London" etc. The same with other points on map. Where to search information about it?
Have a look at this blog post from Google which describes how to use Google Places Autocomplete to accomplish what you're asking about.
(Note: there's a good chance that airbnb.com uses something other than the Google Places API, probably an in-house service - actually I just viewed source and they are using Google Places API for something)
See Demo
The code that toes the work
var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input);
autocomplete.bindTo('bounds', map);
Related
I have found a basic URL structure for regular map tiles:
https://mts1.google.com/vt/lyrs=m#186112443&hl=x-local&src=app&x=1325&y=3143&z=13&s=Galile
What would be the URL structure to grab HYBRID map tiles from Google?
I don't know why I can't find this information; it seems like it should be easy to find.
Am I missing something simple?
.
I have been messing with the lyrs parameter, and I think that may be part of it. When pasting the above URL in a browser, Ive tried lyrs=r, lyrs=h,lyrs=t and they give different tiles.
The closest I have come now is trying lyrs=s. It results in a Satellite tile being returned; but I do not know what I should put in for a HYBRID result.
Maybe I am going about this all wrong.
For anyone who wants to save some time while looking for specific tile types:
h = roads only
m = standard roadmap
p = terrain
r = somehow altered roadmap
s = satellite only
t = terrain only
y = hybrid
You need an instance from the google map js class and an anonymous function then you can set the map object to give hybrid tiles:How to get your image URL tiles? (google maps). Or maybe it's lyrs=y:http://www.neongeo.com/wiki/doku.php?id=map_servers.
TRY: http://mt1.google.com/vt/lyrs=y&x=1325&y=3143&z=13
Hybrid Maps URL:
http://mt0.google.com/vt/lyrs=y&hl=en&x={x}&y={y}&z={z}&s=Ga
The truth is: there is no URL specifically that holds both satellite and street info like you see in google maps hybrid. You have to combine them. Here's an example:
https://github.com/SnakeO/mapbox-with-google-maps-hybrid-tiles
I have a client who has embedded Google Maps showing the location of a new hospital they are building. Until recently it just showed the pin marker, however now it is showing the longitude and latitude next to the pin. I have tried everything to remove this text but none of the options in the query string appear to do anything.
I think Google has updated the embed code but I can't find any documentation about it though. Does anyone have any suggestions?
Thanks
John
From the research I did, it seems like the new Google maps is pretty rigid and there isn't really a simple way. I think it would require some more complex API stuff.
This is the post that I found that described the limitations Removing the info window from an embedded map in the new Google Maps
Sorry I realize that doesn't really help.
How can I search nearest schools for any given post code like shown in following screenshot?
http://i.imgur.com/xjrMp.png
When I go to maps.google.com I don't see this option. Or is it only available through Google Maps API? How can I do this?
The Places API will do something like this. See the example at https://google-developers.appspot.com/maps/documentation/javascript/examples/place-search and alter the code to change "store" to "school" (and the location to something else, if necessary).
The example you quote probably has their own database of schools.
Andrew is exactly right. You'll need to call in places along with your maps.
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
Basic setup:
var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);
map.mapTypes.set(MY_MAPTYPE_ID, customMapType);
// Places request
// ALL TYPES: https://developers.google.com/places/documentation/supported_types
var request = {
location: myLatLng,
radius: 500,
types: ['school']
};
This example will need some modifying when put into use.
I had to do this recently for a project of mine (sorry for the annoying polygon in this example), here is a jsFiddle.
I've been wondering about this for some time:
Is it possible to let a custom marker for a place on a google map display an infowindow with the same information that the infowindows on maps.google.com display when clicking on a place, without having to generate the HTML for the content yourself (using the places library)? I hope you know what I mean. Please let me know if I'm being unclear.
It would be great if one could pull the information straight from google instead of having to do it manually. I mean, why do something that's already there, right? ;)
Thanks for sharing your thoughts!
edit: I've tried rephrasing my question to make it clearer. I've removed the example code because it was just adding to the confusion. Sorry, English isn't my first language ...
There is currently no API call from Google that will provide the default InfoWindow content for a Lat/Long location.
The only thing google currently provides is some Reverse Geocoding Infomation.
I'm absolute newbie as for Google Map / Yahoo Map. I would like to know if it is technically possible to ask to show any city in any country DYNAMICALLY (I mean by passing parameters) and then to show some pictures OVER the map near the city ?
Thanks.
There's a multitude of ways you could accomplish this, some prettier than others.
You could use GInfoWindow to display a popup window with pictures in it at any location.
You could use one of the handy libraries offered here http://code.google.com/p/gmaps-utility-library-dev/ to assist you in displaying those images.
What I would recommend, however, is using http://econym.org.uk/gmap/ewindows.htm to create a window that is similar to GInfoWindow but that is styled by you. Just style the window so that it appears to simply be an overlaid picture.
You could choose to fool around with z-index's and manual positioning with a JavaScript library like jQuery.
Also, to answer the beginning of your question yes you can refocus the map anywhere using GMap's .setCenter() method. Documentation of setCenter(), GInfoWindow and much more available at http://code.google.com/apis/maps/documentation/reference.html
I just started learning this myself.
Here is a good link to get started:
http://code.google.com/apis/maps/
On your second question,
show some pictures OVER the map near
the city?
I like #andykram's response above, but I've implemented this previously using the Panoramio layer available for the Maps API. It can get a bit crowded but its an interface people are used to and because it is so simple to include it in a map, it just be the solution for you this time.
Just add the following to your map initialisation function.
var myLayer = new GLayer("com.panoramio.all");
map.addOverlay(myLayer);
As far as dynamically showing any city in the world in a Google Map, the solution is easily implemented - you need to geocode the name of the city. This can be done by triggering a function on an event like onclick.
function showAddress(address) {
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (point) {
map.setCenter(point, 13);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
}
If you hit a hurdle, try this first - http://econym.org.uk/gmap/ - possibly the best resource for the GMaps API on the web.
GeoExt is a nice framework if you work with maps in general. You can access other kinds of maps too (OSM, GeoServer).