I want my Website users to be showing their current street location on Google Map.
Just like "Facebook Check In" do. (It shows my current location on the map.)
How can it be done simply?
You can show the current location of user on the basis of their IP address.
Use the following script:
<script src="http://j.maxmind.com/app/geoip.js" type="text/javascript"></script>
It returns XML data and retrieve the lat long :
var Latitude = latlng.lat();
var Longitude = latlng.lng();
and I think you will show marker on the basis of that.
According to http://code.google.com/apis/maps/documentation/javascript/basics.html#Geolocation you can use the following code as part of initializing your map:
if(navigator.geolocation) {
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
map.setCenter(initialLocation);
}, function() {
handleNoGeolocation(browserSupportFlag);
});
}
It uses the W3C Geolocation API, which is part of HTML5.
Related
I want to search places by keyword match.
I have used Google Map Places API for this and passed the following arguments for search in this name is dynamically added from search textbox.
var search = {
bounds: map.getBounds(),
keyword:[name] //name=dentist
};
I am getting results in this but these results are not same as I got from google search.
Suppose if I enter dentist and choose location Ahmadabad in auto complete then I need the search results exactly as I search "dentist in ahmedabad" in google.
Is it possible to get same results as google?
Help will be appreciated.
Check Places Library:
The functions in the Google Places JavaScript library enable your application to search for places (defined in this API as establishments, geographic locations, or prominent points of interest) contained within a defined area, such as the bounds of a map, or around a fixed point.
In your case use Text Search Requests:
The Google Places Text Search service is a web service that returns information about a set of places based on a string — for example "pizza in New York" or "shoe stores near Ottawa". The service responds with a list of places matching the text string and any location bias that has been set. The search response will include a list of places. You can send a Place Details request for more information about any of the places in the response.
Text Searches are initiated with a call to the PlacesService's textSearch() method.
service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);
You must also pass a callback method to textSearch(), to handle the results object and a google.maps.places.PlacesServiceStatus response.
var map;
var service;
var infowindow;
function initialize() {
var pyrmont = new google.maps.LatLng(-33.8665433,151.1956316);
map = new google.maps.Map(document.getElementById('map'), {
center: pyrmont,
zoom: 15
});
var request = {
location: pyrmont,
radius: '500',
query: 'restaurant'
};
service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);
}
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
var place = results[i];
createMarker(results[i]);
}
}
}
Hope it helps!
Maybe you know in China there are many services/products of Google banned, so that's so bad that as a developer can't use so great services and products. Like now I meet a problem on Google map. I need to get the longitude and latitude by a known place, but even I use the ditu.google.cn service, the function as below still will request to maps.googleapis.com which should have been banned,
var geocoder = new GClientGeocoder();
var latlng = geocoder.getLatLng(location,function(point) {
if (!point)
{
alert(location + " not found");
}
else
{
window.map.setZoom(13);
var marker = new GMarker(point);
markersArray.push(marker);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
});
Who can give me some advice to solve this obstacle.
Thanks very much.
Google maps works in China. You just have to use a different base URL.
From their website: The Google Maps APIs are served within China from https://maps.google.cn. When serving content to China, replace https://maps.googleapis.com with https://maps.google.cn.
<script src="https://maps.google.cn/maps/api/js?key=API_KEY"
type="text/javascript">
</script>
I am trying to build web app where you input your address and it will give you list of bus stops in your area. I want to use Google Maps for this, but i can't find the way to use them for this. Is there any way to get list of points on maps in, lets say, JSON or XML format? I tried Google Maps Places API, but it didn't work this way. Only thing i found is this example - http://gmaps-samples-v3.googlecode.com/svn/trunk/localsearch/places.html but thats not what i need.
So, anyone knows?
The Google Places API does have stop information on there but you need to form your query very specifically to make it work.
The key is using the nearby search with rankby=distance and radius= and types=bus_station
The default rankby prominence rarely shows bus stations.
Sample query:
https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=49.89458,-97.14137&sensor=true&key=your_key&rankby=distance&types=bus_station
I think it can help you
<script>
// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">
var map;
var infowindow;
function initMap() {
var pyrmont = {lat: 38.06908229560463, lng: 46.31730562744135};
map = new google.maps.Map(document.getElementById('map'), {
center: pyrmont,
zoom: 15
});
infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);
service.nearbySearch({
location: pyrmont,
radius: 1000,
types: ['bus_station','transit_station']
}, callback);
}
function callback(results, status) {
if (status === google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
}
}
}
function createMarker(place) {
var placeLoc = place.geometry.location;
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);
});
}
</script>
Ali Seify's answer is correct except that the API document states that only the first element in the types parameter will be used by the API and the transit_station type is the correct type for bus stop.
Also, in order to get the nearest bus stop, suggest to use parameter rankBy: google.maps.places.RankBy.DISTANCE and radius parameter cannot be used in this case.
service.nearbySearch({
location: pyrmont,
rankBy: google.maps.places.RankBy.DISTANCE,
types: ['transit_station']
}, callback);
This is not a service that Google provides. They surely have all of the stuff you need on record, but they do all of their calculations internally.
One option (which might be a bit difficult) is to mine public transportation schedules for their bus stop locations. It might be an option if you have a small region (ie. a city) that your web app is to support. It's risky because if the pages change then you'll have to reconfigure the data mining application, but you'd still have the same problem trying to mine the data from Google (or somewhere else) - if you could find a way to get a bus stop list with locations and built your app around it, it could change at any time and break your application.
You could use Google Fusion Tables for this. You would have to enter the data yourself though, unless someone else already have entered it. Google maps API supports Google Fusion Tables.
I am building an accommodation website where users can advertise their room with their address.
I want to know if i can use the zipcode to show the exact location in Gmaps which i believe would be much cooler.
I would be very thankful if someone can guide me with simple set of steps to do the same.
thanks in advance!
You may want to use the Client-side Geocoder in the Google Maps API, as in the following example:
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
var geocoder = new GClientGeocoder();
geocoder.setBaseCountryCode("us");
geocoder.getLatLng(
"90210",
function(point) {
if (point) {
map.setCenter(point, 13);
var marker = new GMarker(point);
map.addOverlay(marker);
}
}
);
}
}
// ...
<div id="map_canvas" style="width: 500px; height: 300px"></div>
Simply change the "90210" parameter with the zip code of your users.
Check out the Google Maps API. You can use their geocoding service to convert a full address into coordinates, and then display a marker in a Google Map.
There are libraries available for various languages and platforms.
For PHP, here's an article on Geocoding in PHP (it refers to V2 of the Maps API, though; V3 is the brand-newest.)
I have a town name, gmap modules and plg. i want to focus desired location in gmap by giving town name as input instead of longitude and latitude. Is there any way to do this in Joomla 1.5.x.
Thanks in advance
naveen
You will need a GeoCoder to get the location based on the city name. Don't know nothing about Joomla, but here is and example using JavaScript.
The HTML
<div id='myMap' style="position:relative; width:740px; height:400px;"></div>
The script
You have to complete with the Google API Key and the city you want
<script src="http://maps.google.com/maps?file=api&v=2.x&key=XXXXX">
</script>
<script type="text/javascript">
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function')
{ window.onload = func; }
else {
window.onload = function()
{ oldonload(); func(); }
}
}
var map = null;
var geocoder = null;
addLoadEvent(initialize);
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("myMap"));
map.setCenter(new GLatLng(-12.08, -53.08), 4);
map.addControl(new GSmallMapControl());
map.addControl(new GOverviewMapControl());
geocoder = new GClientGeocoder();
showAddress('YourCity, YourCountry');
}
}
function showAddress(address) {
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
$("#myMap").hide();
} else {
map.setCenter(point, 8);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
}
</script>
I was looking for a way to do something similar myself. I tried using the Google Maps API to search for the location, but it was sometimes wrong. Eventually I ended up querying the Wikipedia page relating to the town and parsing the coordinates, then using those. Probably not the solution you were looking for, but it works for me. I would advise trying to search the Maps API first as Eduardo details, but if that doesn't work, this might.
You can make a HTTP call from Javascript to Google's geocoding service, passing it a place name/postcode, and getting lat/long back.
I do this using the CSV option as I am calling it from ASP, but I think you can get back XML or JSON too.
Fire off this URL if you have a Google maps API key:
http://maps.google.com/maps/geo?gl=uk&q=guildford,+uk&output=csv&key=XXXXXXXXXXX
First parameter back is response code. 200 means success.
Then you get latitude and longitude, comma seperated.