javascript - How to change Google Map location by clicking a button -


i'm trying make button changes location of map, i've seen many answers can't seem make scripts work on map or on website, i'm confuse, don't understand why won't work.

this code:

html:

<div class="info-map"> <ul class="loks">    <li class="active">   <a id="link1" href="#office" data-toggle="tab"> office </a></li>    <li>   <a id="link2" href="#showroom" data-toggle="tab"> showroom </a></li>  </ul></div>  <div id="map"></div> 

css:

  #map {     height: 400px;   }    .info-map {     position: absolute;     z-index: 1;     background: white;     top: 30px;     left: 8%;   } 

script:

  var map; function initmap()    {   var office = {   info: '<strong>architectural art crete - office</strong><br>5815 dewey st, hollywood, fl 33023, usa',   lat: 26.0020213,   long: -80.2058833 };  var showroom = {   info: '<strong>showroom</strong><br>1025 w belmont ave<br> chicago, il 60657',   lat: 41.939670,   long: -87.655167 };  var locations = [     [office.info, office.lat, office.long, 0],     [showroom.info, showroom.lat, showroom.long, 1], ];  var map = new google.maps.map(document.getelementbyid('map'), {   zoom: 15,   center: new google.maps.latlng(26.0020213, -80.2058833),   maptypeid: google.maps.maptypeid.roadmap });  var infowindow = new google.maps.infowindow({});  var marker, i;  (i = 0; < locations.length; i++) {   marker = new google.maps.marker({       position: new google.maps.latlng(locations[i][1], locations[i][2]),       map: map   });    google.maps.event.addlistener(marker, 'click', (function (marker, i) {       return function () {           infowindow.setcontent(locations[i][0]);           infowindow.open(map, marker);       }   })(marker, i)); } } 

i found googleapi solution helped me little can't seem make work both locations

google.maps.event.adddomlistener(document.getelementbyid('link2'), 'click', function () {  map.setcenter(new google.maps.latlng(10.23,123.45)); }); 

your code has problem. please close info: data properly. have missed single quote , comma.

change

info: '<strong>architectural art crete - office</strong><br>\ 5815 dewey st, hollywood, fl 33023, usa, to

info: '<strong>architectural art crete - office</strong><br>5815 dewey st, hollywood, fl 33023, usa',

see updated code.

var map; function initmap()    {       var office = {       info: '<strong>architectural art crete - office</strong><br>5815 dewey st, hollywood, fl 33023, usa',       lat: 26.0020213,       long: -80.2058833     };      var showroom = {       info: '<strong>showroom</strong><br>1025 w belmont ave<br> chicago, il 60657',       lat: 41.939670,       long: -87.655167     };      var locations = [         [office.info, office.lat, office.long, 0],         [showroom.info, showroom.lat, showroom.long, 1],     ];      var map = new google.maps.map(document.getelementbyid('map'), {       zoom: 15,       center: new google.maps.latlng(26.0020213, -80.2058833),       maptypeid: google.maps.maptypeid.roadmap     });      var infowindow = new google.maps.infowindow({});      var marker, i;      (i = 0; < locations.length; i++) {       marker = new google.maps.marker({           position: new google.maps.latlng(locations[i][1], locations[i][2]),           map: map       });        google.maps.event.addlistener(marker, 'click', (function (marker, i) {           return function () {               infowindow.setcontent(locations[i][0]);               infowindow.open(map, marker);           }       })(marker, i));     } } 

one fix here:

google.maps.event.adddomlistener(document.getelementbyid('link2'), 'click', function () { map.setcenter(new google.maps.latlng(10.23,123.45)); } });

this function not closed } missing.
check after update new code.


Comments

Popular posts from this blog

angular - Is it possible to get native element for formControl? -

unity3d - Rotate an object to face an opposite direction -

javascript - Why jQuery Select box change event is now working? -