title: Google Map Click on link/tab to change marker location map
body: <p>Is that possible to click on the other <strong>Tab 2</strong> and the <em>marker/location</em> change? Click back on <strong>Tab 1</strong> <em>marker/location</em> change back to first location.</p>
  
  <p>[Links to Fiddle] <a href="http://jsfiddle.net/ye3x8/" rel="nofollow">http://jsfiddle.net/ye3x8/</a></p>
  
  <pre><code>function initialize() {
  
      var styles = [{
          stylers: [{
              saturation: -100
          }]
      }];
  
      var styledMap = new google.maps.StyledMapType(styles, {
          name: "Styled Map"
      });
  
      var mapProp = {
          center: new google.maps.LatLng(3.165659, 101.611416),
          zoom: 17,
          panControl: false,
          zoomControl: false,
          mapTypeControl: false,
          scaleControl: true,
          streetViewControl: false,
          overviewMapControl: false,
          rotateControl: true,
          scrollwheel: false,
          mapTypeId: google.maps.MapTypeId.ROADMAP
      };
  
      var map = new google.maps.Map(document.getElementById("map_canvas"), mapProp);
  
      map.mapTypes.set('map_style', styledMap);
      map.setMapTypeId('map_style')
  
      var marker = new google.maps.Marker({
          position: new google.maps.LatLng(3.167244, 101.612950),
          animation: google.maps.Animation.DROP,
          icon: 'https://cdn1.iconfinder.com/data/icons/Map-Markers-Icons-Demo-PNG/48/Map-Marker-Marker-Outside-Pink.png',
      });
  
      marker.setMap(map);
  
      google.maps.event.addListener(marker, "click", function () {
  
      });
  }
  
  google.maps.event.addDomListener(window, 'load', initialize);
  </code></pre>