Custom controls

GMaps.js allows to add custom controls:

map.addControl({
  position: 'top_right',
  content: 'Geolocate',
  style: {
    margin: '5px',
    padding: '1px 6px',
    border: 'solid 1px #717B87',
    background: '#fff'
  },
  events: {
    click: function(){
      console.log(this);
    }
  }
});

Note You can use the following positions:

  • top_center
  • top_left
  • top_right
  • left_top
  • right_top
  • left_center
  • right_center
  • left_bottom
  • right_bottom
  • bottom_center
  • bottom_left
  • bottom_right
You can learn more of custom controls here.