CODEWITHSUNDEEP
javascriptjqueryhtmlgoogle-mapsgoogle-maps-api-3
FrancescoMussi
FrancescoMussi

Reputation: 21630

Google Map: How to redirect to other points in the map?

I have a google map and a select. I have to give the user to the select different places in the select and redirect him to that place in the map.

So when a user select place A he can be redirected to San Francisco for example. And when select place B he can be redirected to Los Angeles.

Do you know how can i obtain this?

Here i made a basic example, there is the map and the selector:

http://jsbin.com/iGOmEXeP/2/edit

Here i made my shy attempt to obtain what i needed, that as you see is not working:

http://jsbin.com/iGOmEXeP/3/edit

Hope that somebody can helps me! Thank you!

EDIT:

I have obtained something here: http://jsbin.com/iGOmEXeP/5/edit

Anyway if you have something better, or a way to improve it, i will consider as correct answer.

Upvotes: 1

Views: 503

Answers (1)

Smeegs
Smeegs

Reputation: 9224

You should read up on the documentation here.

https://developers.google.com/maps/documentation/javascript/reference#Map

What you are looking for is either the setCenter() or panTo() methods.

http://jsbin.com/iGOmEXeP/6/edit

Update your bin to include it like so:

$("select").change(function() {
  var $this = $(this);

  if($this.val() === "1") {
   pos = new google.maps.LatLng(-24.397, 150.644);
  } else if($this.val() === "2") {
    pos = new google.maps.LatLng(-44.397, 150.644);
  } 
  map.panTo(pos);
});

Upvotes: 2

Related Questions