CODEWITHSUNDEEP
google-mapsgoogle-maps-api-3
RoR Developer
RoR Developer

Reputation: 151

How to change position of Marker Popup/Tooltip to Left or Right?

enter image description here

The marker display on TOP position. How can we display in Left Position or Right Position ?

This is my Code, Please check it.

  <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
<script type="text/javascript" src="markerwithlabel.js"></script>
<script type="text/javascript">
  function initMap() {
    var locations = [
      ['Manly Beach', -33.800, 151.287, 'BMW-4', 'marker_blue.png'],
      ['Maroubra Beach', -33.950198, 151.259302, 'BMW-5', 'default_marker.png']
    ];
    var latLng = new google.maps.LatLng(-33.92, 151.25);
    var map = new google.maps.Map(document.getElementById('map_canvas'), {
      zoom: 12,
      center: latLng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var infowindow = new google.maps.InfoWindow();
    for (i = 0; i < locations.length; i++) {
      var marker1 = new MarkerWithLabel({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map, labelContent: locations[i][3], labelAnchor: new google.maps.Point(22, 0),
        labelClass: "labels", labelStyle: {opacity: 0.75}, icon: locations[i][4]
      });
      google.maps.event.addListener(marker1, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker1, i));
    }
  }
</script>

Upvotes: 0

Views: 1331

Answers (1)

rafon
rafon

Reputation: 1542

You are talking about the Google Maps Javascript API Info Windows. Currently, there's no way you can change the Info Window's location. However, there are ways you can style/customize your info window. You can use InfoBubble, 5 ways to customize Google Maps InfoWindow.

You might want to check out this post Styling Google Maps InfoWindow .

You can file for a Feature Request at Google Public Issue Tracker. Just provide sufficient details about this request.

Issue Tracker is a tool used internally at Google to track bugs and feature requests during product development. It is available outside of Google for use by external public and partner users who need to collaborate with Google teams on specific projects.

To learn more, you can check Issue Tracker.

Hope it helps!

Upvotes: 1

Related Questions