overlay

This function adds custom overlays on google maps.

Usage

Parameters

• content {string} or {jQuery} Content of the overlay
• pane {google.maps.MapPanes} Layer to add the overlay. Default is floatPane (optional)
• offset {object} Offset position (optional)
  
  • x {integer}
  • y {integer}

Description

This function creates a generic google.maps.OverlayView which contains a div element. The content in the parameter is inserted to this element.
The overlay object also includes the function getDOMElement which allows you to get the dom element.
The following Google events are binded and usable:

• rightclick
• dblclick
• click
• mouseover
• mousemove
• mouseout
• mouseup
• mousedown

Example

This example adds a marker and a custom (and horrible ;) overlay.

var pos = [44.797916, -93.278046];
$("#test").gmap3({ 
  marker:{
    latLng: pos
  },
  overlay:{
    latLng: pos,
    options:{
      content:  '<div style="color:#000000; border:1px solid #FF0000; ' +
                'background-color: #00FF00; width:200px; line-height:20px; ' +
                'height: 20px; text-align:center">Hello World !</div>',
      offset:{
        y:-32,
        x:12
      }
    }
  }
});